@charset "utf-8";

/* ===================================================================
CSS information
 file name  :  normalize.css
 style info :  normalizeスタイル
=================================================================== */

/* -----------------------------------------
Normalize
----------------------------------------- */
/*! normalize.css v4.1.1 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Change the default font family in all browsers (opinionated).
 * 2. Prevent adjustments of font size after orientation changes in IE and iOS.
 */

html {
  -ms-text-size-adjust: 100%; /* 2 */
  -webkit-text-size-adjust: 100%; /* 2 */
  font-size: 62.5%;
}

/**
 * Remove the margin in all browsers (opinionated).
 */
body {
	margin: 0;
}

/* HTML5 display definitions
   ========================================================================== */

/**
 * Add the correct display in IE 9-.
 * 1. Add the correct display in Edge, IE, and Firefox.
 * 2. Add the correct display in IE.
 */

article,
aside,
details, /* 1 */
figcaption,
figure,
footer,
header,
main, /* 2 */
menu,
nav,
section,
summary { /* 1 */
  display: block;
}

/**
 * Add the correct display in IE 9-.
 */

audio,
canvas,
progress,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */

audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Add the correct display in IE 10-.
 * 1. Add the correct display in IE.
 */

template, /* 1 */
[hidden] {
  display: none;
}

/* Links
   ========================================================================== */

/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */

a {
  background-color: transparent; /* 1 */
  -webkit-text-decoration-skip: objects; /* 2 */
}

/**
 * Remove the outline on focused links when they are also active or hovered
 * in all browsers (opinionated).
 */

a:active,
a:hover {
  outline-width: 0;
}

/* Text-level semantics
   ========================================================================== */

/**
 * 1. Remove the bottom border in Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */

abbr[title] {
  border-bottom: none; /* 1 */
  text-decoration: underline; /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted; /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */

b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */

b,
strong {
  font-weight: bolder;
}

/**
 * Add the correct font style in Android 4.3-.
 */

dfn {
  font-style: italic;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */

h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/**
 * Add the correct background and color in IE 9-.
 */

mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */

small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */

/**
 * Remove the border on images inside links in IE 10-.
 */

img {
  border-style: none;
  max-width: 100%;
  display: block;
}

/**
 * Hide the overflow in IE.
 */

svg:not(:root) {
  overflow: hidden;
}

/* Grouping content
   ========================================================================== */

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, monospace; /* 1 */
  font-size: 1em; /* 2 */
}

/**
 * Add the correct margin in IE 8.
 */

figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */

hr {
  -webkit-box-sizing: content-box;
          box-sizing: content-box; /* 1 */
  height: 0; /* 1 */
  overflow: visible; /* 2 */
}

/* Forms
   ========================================================================== */

/**
 * 1. Change font properties to `inherit` in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
select,
textarea {
  font: inherit; /* 1 */
  margin: 0; /* 2 */
}

/**
 * Restore the font weight unset by the previous rule.
 */

optgroup {
  font-weight: 600;
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */

button,
html [type="button"], /* 1 */
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; /* 2 */
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Change the border, margin, and padding in all browsers (opinionated).
 */

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */

legend {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* 1 */
  color: inherit; /* 2 */
  display: table; /* 1 */
  max-width: 100%; /* 1 */
  padding: 0; /* 3 */
  white-space: normal; /* 1 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */

[type="checkbox"],
[type="radio"] {
  -webkit-box-sizing: border-box;
          box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding and cancel buttons in Chrome and Safari on OS X.
 */

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * Correct the text style of placeholders in Chrome, Edge, and Safari.
 */

::-webkit-input-placeholder {
  color: inherit;
  opacity: 0.54;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}


/* -----------------------------------------
Common
----------------------------------------- */
article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
	display: block;
}

audio,canvas,video {
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

audio:not([controls]) {
	display: none;
}

[hidden] {
	display: none;
}

/*code,kbd,pre,samp {
	_font-family: 'courier new',monospace;
}
*/
pre {
	white-space: pre-wrap;
	word-wrap: break-word;
}

q {
	quotes: none;
}

q:before,q:after {
	content: '';
	content: none;
}

menu,ol,ul {
	margin: 0;
}

li {
	list-style: none;
}

dd {
	margin: 0;
}

menu,ol,ul {
	padding: 0;
}

nav,ul,ol {
	list-style: none;
	list-style-image: none;
}

img {
	-ms-interpolation-mode: bicubic;
}

form {
	margin: 0;
}

legend {
	white-space: normal;
	*margin-left: -7px;
}

button,input,select {
	vertical-align: baseline;
}

button,input,select,textarea {
	font-size: 100%;
	*vertical-align: middle;
}

button {
	line-height: normal;
}

button,html input[type="button"],input[type="reset"],input[type="submit"] {
	*overflow: visible;
}

input[type="checkbox"],input[type="radio"] {
	*height: 13px;
	*width: 13px;
}

textarea {
	vertical-align: top;
}

html {
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary {
	display: block;
}

audio,canvas,progress,video {
	display: inline-block;
	vertical-align: baseline;
}

audio:not([controls]) {
	display: none;
	height: 0;
}

[hidden],template {
	display: none;
}

a {
	background: 0 0;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;

	/*  &:hover {
	 	opacity: 0.7;

	 	@include mq(sp) {
	 		opacity: 1;
	 	}
	 } */
}

a:active,a:hover {
	outline: 0;
}

abbr[title] {
	border-bottom: 1px dotted;
}

b {
	font-weight: 700;
}

mark {
	background: #ff0;
	color: #000;
}

sub,sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -.5em;
}

sub {
	bottom: -.25em;
}

img {
	border: 0;
}

svg:not(:root) {
	overflow: hidden;
}

hr {
	-webkit-box-sizing: content-box;
	        box-sizing: content-box;
}

pre {
	overflow: auto;
}

code,kbd {
	font-size: 1em;
}

pre {
	font-family: monospace,monospace;
}

pre,samp {
	font-size: 1em;
}

button,input,optgroup,select,textarea {
	color: inherit;
	font: inherit;
	margin: 0;
}

button {
	overflow: visible;
}

button,select {
	text-transform: none;
}

button,html input[type="button"],input[type="reset"],input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}

button[disabled],html input[disabled] {
	cursor: default;
}

button::-moz-focus-inner,input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input {
	line-height: normal;
}

input[type="checkbox"],input[type="radio"] {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
	padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
	        box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

fieldset {
	border: 1px solid silver;
}

legend {
	border: 0;
	padding: 0;
}

textarea {
	overflow: auto;
}

optgroup {
	font-weight: 700;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

html {
	-webkit-font-kerning: normal;
	-moz-font-kerning: normal;
	-ms-font-kerning: normal;
	-o-font-kerning: normal;
	font-kerning: normal;
	-webkit-text-size-adjust: none;
	-ms-text-size-adjust: none;
	width: 100%;
	height: 100%;
}

h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
}

h1,h2,h3,h4,h5,h6,body,p,pre,blockquote,figure,dl,dl dt,dl dd {
	margin: 0;
	padding: 0;
}

a:link:focus {
	outline: none;
}

[contenteditable]:focus,img:focus,map area:focus {
	outline: none;
}

th,td,fieldset {
	padding: 0;
}

fieldset {
	margin: 0;
}

html {
	color: #000;
	font-family: var(--font-family-primary);
	font-size: 62.5%;
	line-height: 1.5;
}

html[lang="en-US"]{
		font-family: var(--font-family-secondary);
	}

hr {
	display: block;
	width: 100%;
	height: 1px;
	border: 0 none;
}

a:link,a:visited {
	/* color: #000; */
	text-decoration: none;
}

a:hover,a:focus {
	/* color: #000; */
}

a:active {
	/* color: #000; */
}

a:focus {
	outline: none;
}

em {
	font-style: normal;
}

em,strong {
	font-weight: 700;
}

small {
	font-size: .8em;
}

cite {
	font-weight: 700;
	font-style: normal;
}

cite:before {
	content: '『';
	font-weight: 400;
}

cite:after {
	content: '』';
	font-weight: 400;
}

q:before {
	content: '❝';
}

q:after {
	content: '❞';
}

dfn {
	font-weight: 700;
	font-style: normal;
}

code {
	margin: 0 2px;
	padding: 3px 5px;
	border: 1px solid rgba(0,0,0,.1);
	border-radius: 3px;
	background: rgba(0,0,0,.025);
}

samp {
	color: #fff;
	background: rgba(0,0,0,.9);
}

samp,kbd {
	margin: 0 2px;
	padding: 3px 5px;
	border: 1px solid rgba(0,0,0,.1);
	border-radius: 3px;
}

kbd {
	background: rgba(0,0,0,.025);
}

kbd kbd {
	display: inline-block;
	font-weight: 700;
	line-height: 1;
	margin: 1px;
	padding: 1px 10px;
	border: 1px solid rgba(0,0,0,.6);
	background: #eee;
	-webkit-box-shadow: 1px 1px 1px rgba(255,255,255,.5)inset,-1px -1px 1px rgba(0,0,0,.5)inset;
	        box-shadow: 1px 1px 1px rgba(255,255,255,.5)inset,-1px -1px 1px rgba(0,0,0,.5)inset;
}

pre code {
	display: block;
	padding: 5px 10px;
}

pre kbd {
	display: block;
	color: #fff;
}

pre kbd:after {
	content: '|';
	opacity: .6;
}

pre kbd kbd {
	color: #000;
	display: inline;
	background: #eee;
}

pre kbd kbd:after {
	display: none;
}

pre samp {
	display: block;
	padding: 5px 10px;
}

var {
	font-family: serif;
	font-weight: 700;
	margin: 0 2px;
	padding: 3px 5px;
	border-radius: 3px;
	background: rgba(0,0,0,.025);
}

* {
	-webkit-box-sizing: border-box;
	        box-sizing: border-box;
}

img {vertical-align: bottom;}

@media only screen and (max-width: 736px) {
	img{
		max-width: 100%;
		height: auto;
	}
}

html,
body {
	height: 100%;
}

ul, ol, h1, h2, h3, h4, h5, h6, p {
    margin: 0;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
}

/* ===================================================================
  CSS information
  file name  :  color.css
  デザインハンドオフ README「Colors」の値をトークン化
=================================================================== */

:root {
    /* サイトで最も明るい色 / 暗い色 */
    --color-lightest: #fff;
    --color-darkest: #000;
    /* 背景 */
    --color-bg-base: #fff;
    /* ブランドグリーン（見出し・リンク・主要UI） */
    --color-primary: #1F7A34;
    --color-primary-hover: #2B8E4B;
    /* アクセントグリーン（ルール線・ドット・枠線） */
    --color-accent: #36AD5D;
    /* 見出しの濃い緑（石灰・採石） */
    --color-heading-dark: #1F4D2B;
    /* 表のグループ見出し背景（M2 肥育データ） */
    --color-table-group: #E3EFDD;
    /* ヒーロー強調文字 */
    --color-light-green: #CAF68B;
    /* 淡いグリーン背景 */
    --color-pale-01: #F3F7EE;
    --color-pale-02: #ECF6E7;
    --color-pale-03: #EAF3E6;
    --color-pale-04: #DDEFD3;
    --color-pale-01-a96: rgba(243, 247, 238, .96);
    --color-pale-01-f0: #F3F7EEF0;
    /* アクセントレッド（h2 強調・CTA ボタン・番号） */
    --color-red: #C8431F;
    --color-red-hover: #A33718;
    /* オレンジ（トップ FV「見積依頼」のみ） */
    --color-orange: #B45309;
    --color-orange-hover: #8F4207;
    /* イエロー ハイライト */
    --color-yellow-01: #ECC75F;
    --color-yellow-02: #FFE38A;
    --color-yellow-03: #F3E97A;
    /* クリーム背景 */
    --color-cream-01: #FAF7E6;
    --color-sky-01: #D6EEFB;
    --color-cream-02: #FBF5D6;
    --color-cream-03: #FBF7E8;
    --color-cream-line: #EAE3CF;
    /* テキスト */
    --color-text: #000;
    --color-text-sub: #6E736C;
    --color-text-weak: #9AA69B;
    /* リンク */
    --color-link: #1F7A34;
    /* ボーダー */
    --color-border-01: #E5E7EB;
    --color-border-02: #D8D8D0;
    --color-border-03: #EEF0EB;
    --color-border-04: #D8DED4;
    --color-hairline: #B9BEB4;
    /* その他 */
    --color-frame: #EDEBE4;
    --color-tel-bg: #F6F4EE;
    --color-pasture-fill: #EAF3E4;
    --color-logo: #FF0000;
    --color-num-light: #A6D28F;
    --color-caution-rule: #E0A98F;
    --color-movie-bg: #0F2B18;
    --color-hero-base: #0B3B1E;
    --color-error-bg: #FDF0EC;
    /* グラフ */
    --color-chart-control: #9AA69B;
    --color-chart-mid: #4E9A5C;
    --color-chart-bar-gray: #C9CEC6;
    --color-chart-green: #2E9A4E;
    --color-chart-axis: #D8D8D0;
    --color-chart-grid: #EDEDE6;
    /* M2 TMR: 麹菌比較の「一般的な方法」カード・コスト表の直接給与列 */
    --color-gray-bg: #F5F5F2;
    --color-gray-ring: #9AA09A;
    --color-gray-text: #4B4F49;
    --color-gray-head: #8C918A;
    --color-gray-chip: #F0F0EC;
    /* 透明カラー */
    --color-white-a95: rgba(255, 255, 255, .95);
    --color-white-a94: rgba(255, 255, 255, .94);
    --color-white-a96: rgba(255, 255, 255, .96);
    --color-white-a90: rgba(255, 255, 255, .9);
    --color-white-a92: rgba(255, 255, 255, .92);
    --color-white-a50: rgba(255, 255, 255, .5);
    --color-white-a97: rgba(255, 255, 255, .97);
    --color-white-a80: rgba(255, 255, 255, .8);
    --color-white-a70: rgba(255, 255, 255, .7);
    --color-white-a45: rgba(255, 255, 255, .45);
    --color-white-a25: rgba(255, 255, 255, .25);
    --color-white-a12: rgba(255, 255, 255, .12);
    --color-white-a14: rgba(255, 255, 255, .14);
    /* グラデーション */
    --gradient-cta: linear-gradient(180deg, rgba(16, 58, 28, .78) 0%, rgba(20, 84, 40, .62) 45%, rgba(16, 58, 28, .70) 100%);
    --gradient-hero-pc: linear-gradient(90deg, rgba(16, 58, 28, .88) 0%, rgba(16, 58, 28, .7) 22%, rgba(16, 58, 28, .28) 42%, rgba(16, 58, 28, 0) 56%);
    --gradient-hero-pc-privacy: linear-gradient(90deg, rgba(16, 58, 28, .88) 0%, rgba(16, 58, 28, .7) 16%, rgba(16, 58, 28, .28) 30%, rgba(16, 58, 28, 0) 40%);
    --gradient-hero-pc-product: linear-gradient(90deg, rgba(8, 40, 20, .55) 0%, rgba(8, 40, 20, .4) 30%, rgba(8, 40, 20, 0) 52%);
    --gradient-hero-pc-top: linear-gradient(90deg, rgba(16, 58, 28, .86) 0%, rgba(16, 58, 28, .62) 28%, rgba(16, 58, 28, .10) 46%, rgba(16, 58, 28, 0) 56%);
    --gradient-hero-sp: linear-gradient(180deg, rgba(16, 58, 28, .25) 0%, rgba(16, 58, 28, .35) 45%, rgba(16, 58, 28, .46) 100%);
    /* トップ FV（SP）: 写真の上の白い要素へ付ける薄い影（グラデーションと併用して可読性を補う） */
    --shadow-fv-text: 0 1px 8px rgba(8, 40, 20, .55), 0 0 2px rgba(8, 40, 20, .35);
    --shadow-fv-drop: 0 1px 4px rgba(8, 40, 20, .5);
    /* トップ FV（SP）: 見出し・本文の帯（22〜56%）だけを濃くし、写真の上部・下部は薄く */
    --gradient-hero-sp-top: linear-gradient(180deg, rgba(16, 58, 28, 0) 0%, rgba(16, 58, 28, .2) 22%, rgba(16, 58, 28, .46) 34%, rgba(16, 58, 28, .46) 56%, rgba(16, 58, 28, .18) 74%, rgba(16, 58, 28, .24) 100%);
    --gradient-silver: linear-gradient(135deg, #F4F5F6 0%, #C9CDD2 18%, #FDFDFE 38%, #A9AFB6 58%, #E8EAEC 76%, #B7BCC2 100%);
    --gradient-green-band: linear-gradient(90deg, #1F7A34, #36AD5D);
    --gradient-green-ring: linear-gradient(135deg, #DDEFD3 0%, #36AD5D 50%, #1F7A34 100%);
    --gradient-combo: linear-gradient(135deg, #F3F7EE 0%, #DDEFC9 35%, #9ED47A 70%, #4FB35A 100%);
    --gradient-sky: linear-gradient(180deg, #D6EEFB 0%, #E8F5FC 45%, #F4FAFD 100%);
    --gradient-sky-m2: linear-gradient(180deg, #D6EEFB 0%, #BBE4FC 100%);
    --gradient-hl-yellow: linear-gradient(transparent 60%, #F3E97A 60%);
    --gradient-hl-price: linear-gradient(transparent 55%, #FFE38A 55%);
    --gradient-koji: linear-gradient(180deg, #fff 0%, #F3FAF0 100%);
    /* 石灰・採石 納入先リストの丸ドット */
    --gradient-dot-green: radial-gradient(circle at 35% 35%, #5CC27A, #1F7A34);
    --gradient-dot-red: radial-gradient(circle at 35% 35%, #F07A55, #C8431F);
    /* 石灰・採石 FLOW の写真オーバーレイ */
    --gradient-ls-rocks: linear-gradient(180deg, transparent 30%, rgba(60, 64, 58, .55) 55%, rgba(70, 72, 66, .92) 78%);
    --gradient-ls-green: linear-gradient(180deg, transparent 18%, color-mix(in srgb, #1F7A34 85%, transparent) 55%, #1F7A34 78%);
    --gradient-ls-red: linear-gradient(180deg, transparent 18%, color-mix(in srgb, #C8431F 85%, transparent) 55%, #C8431F 78%);
    /* ドロップシャドウ */
    --shadow-card: 0 10px 32px rgba(31, 122, 52, .12);
    /* 石灰・採石: 写真カード・丸アイコン・バッジ・写真上の白文字 */
    --shadow-photo: 0 6px 18px rgba(0, 0, 0, .12);
    --shadow-icon: 0 4px 12px rgba(0, 0, 0, .12);
    --shadow-icon-strong: 0 4px 14px rgba(0, 0, 0, .18);
    --shadow-badge: 0 4px 10px rgba(0, 0, 0, .12);
    --shadow-text-photo: 0 1px 6px rgba(0, 0, 0, .3);
    --shadow-text-photo-weak: 0 1px 6px rgba(0, 0, 0, .25);
    --shadow-card-mid: 0 8px 28px rgba(31, 122, 52, .10);
    --shadow-card-weak: 0 6px 24px rgba(31, 122, 52, .08);
    --shadow-card-soft: 0 10px 32px rgba(31, 122, 52, .10);
    --shadow-combo: 0 12px 32px rgba(31, 122, 52, .20);
    --shadow-header: 0 6px 24px rgba(0, 0, 0, .10);
    --shadow-hover: 0 6px 24px rgba(0, 0, 0, .10);
    --shadow-header-sp: 0 2px 12px rgba(0, 0, 0, .08);
    --shadow-drawer: 0 12px 32px rgba(0, 0, 0, .14);
    --shadow-circle: 0 10px 32px rgba(0, 0, 0, .18);
    --shadow-icon: 0 6px 18px rgba(31, 122, 52, .18);
    --shadow-koji: 0 14px 40px rgba(31, 122, 52, .16);
    --shadow-photo: 0 6px 18px rgba(0, 0, 0, .10);
    --shadow-cost-card: 0 16px 44px rgba(31, 122, 52, .22);
    --shadow-cost-card-sp: 0 12px 36px rgba(31, 122, 52, .18);
    --shadow-badge-red: 0 8px 20px rgba(200, 67, 31, .35);
}

/* ===================================================================
  CSS information
  file name  :  dimension.css
  流体サイズ: min(calc(N / var(--width-base) * 100vw), Nrem)  ※1rem = 10px
  PC はデザイン幅 1440 基準、SP は 390 基準（〜767px は px 上限で固定）
=================================================================== */

:root {
    /* デザイン基準幅 */
    --width-base: 1440;
    /* コンテンツ幅 */
    /* ヘッダー */
    /* PC ヘッダー・電話バーの左右余白（1302px 以上で 30px、狭い PC はナビが収まるよう縮小） */
    /* 部品の寸法（今回追加分） */          /* ヒーロー: 吹き出し〜ボタン */            /* お問い合わせ: LINE QR */          /* 強調カードの枠線 */           /* 受胎率: 見出し〜カード */
    /* 角丸 */
    /* z-index */
    /* transition */
}

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

:root {
        --width-base: 390;
}
    }

:root{
    --width-main: 1120px;
    --width-hero: 1360px;
    --width-news: 1160px;
    --width-compare: 1060px;
    --width-records: 1200px;
    --width-read: 960px;
    --width-history: 900px;
    --width-narrow: 860px;
    --width-cta: 720px;
    --padding-side: 40px;
}

/* セクション左右余白 */

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

:root {
        --padding-side: 20px;
}
    }

:root{
    --header-h-pc: 70px;
    --header-top-pc: 16px;
    --header-side: clamp(16px, 2.3vw, 30px);
    --header-pull-pc: -146px;
    --header-h-sp: 60px;
    --gap-hero-badge: 12px;
    --size-line-qr: 96px;
    --padding-line-qr: 4px;
    --gap-line-qr-caption: 6px;
    --border-emphasis: 2px;
    --conception-mt: 40px;
    --conception-item-padding: 28px 20px 26px;
    --conception-v-mt: 8px;
    --conception-unit-ml: 2px;
    --conception-n-mt: 6px;
    --conception-source-mt: 16px;
    --radius-card: 14px;
    --radius-card-lg: 16px;
    --radius-row: 20px;
    --radius-qa: 12px;
    --radius-product: 10px;
    --radius-box: 10px;
    --radius-card-xl: 18px;
    --radius-sheet: 22px;
    --radius-image: 8px;
    --radius-btn: 6px;
    --radius-btn-sm: 4px;
    --radius-btn-outline: 10px;
    --radius-badge: 3px;
    --radius-pill: 9999px;
    --z-splash: 100;
    --z-header: 50;
    --z-telbar: 40;
    --z-menu: 40;
    --z-content: 1;
    --trans-hover: all .25s ease;
    --trans-fade: opacity .2s ease, visibility .2s ease;
    --trans-dot: all .4s ease;
}


/* ブレイクポイント（767px 以下 = SP / 768px 以上 = PC） */
/* ===================================================================
  CSS information
  file name  :  fonts.css
  Google Fonts は header.php の <link> で読み込む（@import は使わない）
  Noto Sans JP 400/500/700/900・Poppins 500/600/700・Noto Serif JP 700（お客様の声 詳細のみ）
=================================================================== */

:root {
    /* フォントファミリー */
    --font-family-primary: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
    --font-family-en: "Poppins", sans-serif;
    --font-family-serif: "Noto Serif JP", "Hiragino Mincho ProN", serif;
    /* 見出し（デザイン指定の clamp をそのまま使用） */
    --font-size-h1: clamp(30px, 3.9vw, 50px);
    --font-size-h2: clamp(24px, 2.6vw, 36px);
    --font-size-h2-lg: clamp(28px, 3vw, 44px);
    --font-size-h2-ls: clamp(28px, 3.4vw, 48px);
    --font-size-cta-h2: clamp(24px, 2.6vw, 34px);
    --font-size-cta-h2-sm: clamp(22px, 2.6vw, 32px);
}

/* SP はデザインの clamp() の下限値（390px 幅）。トップ・腸菌力シリーズの SP 専用見出しは各ページ CSS で 26px */

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

:root {
        --font-size-h1: 3.5rem;
        --font-size-h2: 2.4rem;
        --font-size-h2-lg: 2.8rem;
        --font-size-h2-ls: 2.8rem;
        --font-size-cta-h2: 2.2rem;
        --font-size-cta-h2-sm: 2.2rem
}
    }

/* ===================================================================
   CSS information
   file name  :  common.css
=================================================================== */

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

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

body {
    margin: 0;
    font-family: var(--font-family-primary);
    font-size: 1.6rem;
    line-height: normal;
    color: var(--color-text);
    background-color: var(--color-bg-base);
    -webkit-font-smoothing: antialiased;
    overflow-x: clip;
}

a {
    color: var(--color-link);
    text-decoration: none;
    -webkit-transition: var(--trans-hover);
    transition: var(--trans-hover);
}

a:hover {
        color: var(--color-primary-hover);
    }

img,
svg {
    max-width: 100%;
    height: auto;
    display: block;
}

svg {
    max-width: none;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
dl,
dd,
figure,
blockquote {
    margin: 0;
}

ul,
ol {
    padding: 0;
    list-style: none;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

:focus-visible {
    outline: 2px solid var(--color-primary);
    outline-offset: 2px;
}

.l-page {
    position: relative;
    overflow-x: clip;
    background-color: var(--color-bg-base);
}

.l-main {
    display: block;
    position: relative;
}


/* PC/SP出し分け */

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

.pc-only {
        display: none !important
}
    }

@media only screen and (min-width: 768px) {

.sp-only {
        display: none !important
}
    }


/* 英字・数値（Poppins） */

.u-en {
    font-family: var(--font-family-en);
}

.u-nowrap {
    white-space: nowrap;
}

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


/* 蛍光ペン風ハイライト */

.c-hl {
    background: var(--gradient-hl-yellow);
}

.c-hl--price {
        background: var(--gradient-hl-price);
    }


/* 赤強調（見出し内） */

.c-em {
    color: var(--color-red);
}


/* スクリーンリーダー専用 */

.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
    white-space: nowrap;
}


/* 日本語見出しの文節折り返し（Chromium のみ有効） */

.u-phrase {
    word-break: auto-phrase;
}


/* 汎用グリッド（auto-fit）。SP もデザインは PC と同値（トップ・腸菌力シリーズの SP は各ページ CSS） */

.c-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
    gap: 24px;
    margin-top: 44px;
}

.c-grid--min200 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
    }

.c-grid--min240 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    }

.c-grid--min250 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
    }

.c-grid--min260 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    }

.c-grid--min300 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
    }

.c-grid--min320 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr));
    }

.c-grid--min340 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr));
    }

.c-grid--min400 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr));
    }

.c-grid--min420 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr));
    }

.c-grid--min460 {
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
    }

/* PC 3 列均等 / SP 1 列 */

.c-grid--cols3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

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

.c-grid--cols3 {
            grid-template-columns: minmax(0, 1fr)
    }
        }

.c-grid--gap16 {
        gap: 16px;
    }

.c-grid--gap18 {
        gap: 18px;
    }

.c-grid--gap20 {
        gap: 20px;
    }

.c-grid--gap24 {
        gap: 24px;
    }

.c-grid--gap28 {
        gap: 28px;
    }

.c-grid--gap32 {
        gap: 32px;
    }

.c-grid--gap40 {
        gap: 40px;
    }

.c-grid--start {
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
    }

.c-grid--stretch {
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
    }

.c-grid--mt0 {
        margin-top: 0;
    }

.c-grid--mt28 {
        margin-top: 28px;
    }

.c-grid--mt32 {
        margin-top: 32px;
    }

.c-grid--mt36 {
        margin-top: 36px;
    }

.c-grid--mt40 {
        margin-top: 40px;
    }

.c-grid--mt48 {
        margin-top: 48px;
    }


/* 出典・注記 */

.c-source {
    margin-top: 12px;
    font-size: 1.3rem;
    color: var(--color-text-sub);
}

.c-source--center {
        text-align: center;
    }


/* 電話番号リンクは PC では押せない（発信は script.js の nnsgTelPc で無効化）。カーソルも通常にし、番号のコピーは可能 */

@media only screen and (min-width: 768px) {

a[href^="tel:"] {
        cursor: text
}
    }

/* スクロール表示: 各セクションのコンテンツ（__inner）を画面に入ったらフェードイン
   背景・アーチ・リーフは動かさない。html.is-reveal は header.php のインラインスクリプトが付与し、
   script.js（nnsgReveal）が画面に入った要素へ is-inview を付ける。JS 無効・読み込み失敗時は常に表示 */

.is-reveal .c-section > .c-section__inner,
    .is-reveal .c-cta__inner {
        opacity: 0;
        -webkit-transform: translateY(32px);
                transform: translateY(32px);
        -webkit-transition: opacity .9s ease, -webkit-transform .9s cubic-bezier(.22, 1, .36, 1);
        transition: opacity .9s ease, -webkit-transform .9s cubic-bezier(.22, 1, .36, 1);
        transition: opacity .9s ease, transform .9s cubic-bezier(.22, 1, .36, 1);
        transition: opacity .9s ease, transform .9s cubic-bezier(.22, 1, .36, 1), -webkit-transform .9s cubic-bezier(.22, 1, .36, 1);
    }

.is-reveal .c-section > .c-section__inner.is-inview, .is-reveal .c-cta__inner.is-inview {
            opacity: 1;
            -webkit-transform: none;
                    transform: none;
        }

@media (prefers-reduced-motion: reduce), print {
        .is-reveal .c-section > .c-section__inner,
        .is-reveal .c-cta__inner {
            opacity: 1;
            -webkit-transform: none;
                    transform: none;
            -webkit-transition: none;
            transition: none;
        }
}

/* ===================================================================
  CSS information
  file name  :  c-section.css
  セクションの外枠・内幅・上辺アーチ
=================================================================== */

.c-section {
    position: relative;
    isolation: isolate;
    padding: min(calc(104 / var(--width-base) * 100vw), 104px) var(--padding-side);
}

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

.c-section {
        padding: min(calc(57 / var(--width-base) * 100vw), 57px) var(--padding-side)
}
    }

/* 背景色 */

.c-section--white {
        --section-bg: var(--color-lightest);
        background-color: var(--section-bg);
    }

.c-section--cream {
        --section-bg: var(--color-cream-01);
        background-color: var(--section-bg);
    }

.c-section--pale {
        --section-bg: var(--color-pale-01);
        background-color: var(--section-bg);
    }

.c-section--clip {
        overflow: hidden;
    }

/* 境界フェード: 背景写真がセクションの上端・下端で直線に切れて見えないよう、
       背景画像・リーフの上 / コンテンツ（__inner）の下に「指定色 → 透明」の帯を重ね、隣接セクションと同じ色へ溶かす
       --fade-{t|b}-{white|cream|pale|sky}（上端 / 下端、溶かす色） */

.c-section[class*="c-section--fade-"] {
        --fade-size: clamp(96px, 11.1vw, 160px);
    }

/* 境界が小数点以下の位置になる幅でも端の 1 行を覆い切るよう、帯は上下に 1px はみ出させる
           （はみ出した行は隣のセクションと同じ色なので見た目は変わらない） */

.c-section[class*="c-section--fade-"]::after {
            content: "";
            position: absolute;
            inset: -1px 0;
            z-index: 0;
            background:
                linear-gradient(180deg, var(--fade-t-color, transparent) 0%, color-mix(in srgb, var(--fade-t-color, transparent) 72%, transparent) 30%, color-mix(in srgb, var(--fade-t-color, transparent) 28%, transparent) 65%, transparent 100%) top / 100% var(--fade-t, 0px) no-repeat,
                linear-gradient(0deg, var(--fade-b-color, transparent) 0%, color-mix(in srgb, var(--fade-b-color, transparent) 72%, transparent) 30%, color-mix(in srgb, var(--fade-b-color, transparent) 28%, transparent) 65%, transparent 100%) bottom / 100% var(--fade-b, 0px) no-repeat;
            pointer-events: none;
        }

.c-section[class*="c-section--fade-"] > .c-section__inner {
            z-index: 1;
        }

.c-section--fade-t-white,
    .c-section--fade-t-cream,
    .c-section--fade-t-pale,
    .c-section--fade-t-sky {
        --fade-t: var(--fade-size);
    }

.c-section--fade-b-white,
    .c-section--fade-b-cream,
    .c-section--fade-b-pale,
    .c-section--fade-b-sky {
        --fade-b: var(--fade-size);
    }

.c-section--fade-t-white {
        --fade-t-color: var(--color-lightest);
    }

.c-section--fade-t-cream {
        --fade-t-color: var(--color-cream-01);
    }

.c-section--fade-t-pale {
        --fade-t-color: var(--color-pale-01);
    }

.c-section--fade-t-sky {
        --fade-t-color: var(--color-sky-01);
    }

.c-section--fade-b-white {
        --fade-b-color: var(--color-lightest);
    }

.c-section--fade-b-cream {
        --fade-b-color: var(--color-cream-01);
    }

.c-section--fade-b-pale {
        --fade-b-color: var(--color-pale-01);
    }

.c-section--fade-b-sky {
        --fade-b-color: var(--color-sky-01);
    }

/* SP もデザインは同値（-96px / 110px）。トップ・腸菌力シリーズのみ SP 専用値（--arch-sm） */

.c-section--arch {
        margin-top: -96px;
        background-color: transparent;
        overflow: hidden;
    }

.c-section--arch::before {
            content: "";
            position: absolute;
            inset: 0 -15%;
            z-index: -1;
            background: var(--section-bg, var(--color-lightest));
            border-radius: 50% 50% 0 0 / 110px 110px 0 0;
            pointer-events: none;
        }

/* 上辺アーチ（前セクションに -96px で重なる楕円） */

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

.c-section--arch-sm {
            margin-top: -40px
    }
            .c-section--arch-sm::before,
            .c-section--arch-sm .c-section__arch-clip {
                inset: 0 -20%;
                border-radius: 50% 50% 0 0 / 60px 60px 0 0;
            }
        }

/* 上下パディングのバリエーション（PC / SP） */

.c-section--pad-120-96 {
        padding-top: min(calc(120 / var(--width-base) * 100vw), 120px);
        padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px);
    }

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

.c-section--pad-120-96 {
            padding-top: min(calc(66 / var(--width-base) * 100vw), 66px);
            padding-bottom: min(calc(58 / var(--width-base) * 100vw), 58px)
    }
        }

.c-section--pad-120-88 {
        padding-top: min(calc(120 / var(--width-base) * 100vw), 120px);
        padding-bottom: min(calc(88 / var(--width-base) * 100vw), 88px);
    }

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

.c-section--pad-120-88 {
            padding-top: min(calc(66 / var(--width-base) * 100vw), 66px);
            padding-bottom: min(calc(53 / var(--width-base) * 100vw), 53px)
    }
        }

.c-section--pad-120-72 {
        padding-top: min(calc(120 / var(--width-base) * 100vw), 120px);
        padding-bottom: min(calc(72 / var(--width-base) * 100vw), 72px);
    }

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

.c-section--pad-120-72 {
            padding-top: min(calc(66 / var(--width-base) * 100vw), 66px);
            padding-bottom: min(calc(43 / var(--width-base) * 100vw), 43px)
    }
        }

.c-section--pad-104-120 {
        padding-bottom: min(calc(120 / var(--width-base) * 100vw), 120px);
    }

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

.c-section--pad-104-120 {
            padding-bottom: min(calc(72 / var(--width-base) * 100vw), 72px)
    }
        }

.c-section--pad-104-140 {
        padding-bottom: min(calc(140 / var(--width-base) * 100vw), 140px);
    }

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

.c-section--pad-104-140 {
            padding-bottom: min(calc(84 / var(--width-base) * 100vw), 84px)
    }
        }

.c-section--pad-104-150 {
        padding-bottom: min(calc(150 / var(--width-base) * 100vw), 150px);
    }

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

.c-section--pad-104-150 {
            padding-bottom: min(calc(90 / var(--width-base) * 100vw), 90px)
    }
        }

.c-section--pad-104-96 {
        padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px);
    }

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

.c-section--pad-104-96 {
            padding-bottom: min(calc(57 / var(--width-base) * 100vw), 57px)
    }
        }

.c-section--pad-104-48 {
        padding-bottom: min(calc(48 / var(--width-base) * 100vw), 48px);
    }

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

.c-section--pad-104-48 {
            padding-bottom: min(calc(40 / var(--width-base) * 100vw), 40px)
    }
        }

.c-section--pad-96-120 {
        padding-top: min(calc(96 / var(--width-base) * 100vw), 96px);
        padding-bottom: min(calc(120 / var(--width-base) * 100vw), 120px);
    }

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

.c-section--pad-96-120 {
            padding-top: min(calc(53 / var(--width-base) * 100vw), 53px);
            padding-bottom: min(calc(72 / var(--width-base) * 100vw), 72px)
    }
        }

.c-section--pad-96 {
        padding-top: min(calc(96 / var(--width-base) * 100vw), 96px);
        padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px);
    }

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

.c-section--pad-96 {
            padding-top: min(calc(53 / var(--width-base) * 100vw), 53px);
            padding-bottom: min(calc(53 / var(--width-base) * 100vw), 53px)
    }
        }

.c-section--pad-88-96 {
        padding-top: min(calc(88 / var(--width-base) * 100vw), 88px);
        padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px);
    }

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

.c-section--pad-88-96 {
            padding-top: min(calc(48 / var(--width-base) * 100vw), 48px);
            padding-bottom: min(calc(58 / var(--width-base) * 100vw), 58px)
    }
        }

.c-section--pad-60-48 {
        padding-top: min(calc(60 / var(--width-base) * 100vw), 60px);
        padding-bottom: min(calc(48 / var(--width-base) * 100vw), 48px);
    }

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

.c-section--pad-60-48 {
            padding-top: min(calc(56 / var(--width-base) * 100vw), 56px);
            padding-bottom: min(calc(56 / var(--width-base) * 100vw), 56px)
    }
        }

.c-section--pad-64-72 {
        padding-top: min(calc(64 / var(--width-base) * 100vw), 64px);
        padding-bottom: min(calc(72 / var(--width-base) * 100vw), 72px);
    }

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

.c-section--pad-64-72 {
            padding-top: min(calc(56 / var(--width-base) * 100vw), 56px);
            padding-bottom: min(calc(56 / var(--width-base) * 100vw), 56px)
    }
        }

.c-section--pad-48 {
        padding-top: min(calc(48 / var(--width-base) * 100vw), 48px);
        padding-bottom: min(calc(48 / var(--width-base) * 100vw), 48px);
    }

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

.c-section--pad-48 {
            padding-top: min(calc(56 / var(--width-base) * 100vw), 56px);
            padding-bottom: min(calc(56 / var(--width-base) * 100vw), 56px)
    }
        }

.c-section--pad-48-96 {
        padding-top: min(calc(48 / var(--width-base) * 100vw), 48px);
        padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px);
    }

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

.c-section--pad-48-96 {
            padding-top: min(calc(56 / var(--width-base) * 100vw), 56px);
            padding-bottom: min(calc(96 / var(--width-base) * 100vw), 96px)
    }
        }

.c-section--pad-0-72 {
        padding-top: 0;
        padding-bottom: min(calc(72 / var(--width-base) * 100vw), 72px);
    }

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

.c-section--pad-0-72 {
            padding-top: 0;
            padding-bottom: min(calc(48 / var(--width-base) * 100vw), 48px)
    }
        }

/* アーチ上部の装飾は、アーチの曲線内側だけに見せる（::before と同形状） */

.c-section__arch-clip {
        position: absolute;
        inset: 0 -15%;
        z-index: 0;
        overflow: hidden;
        border-radius: 50% 50% 0 0 / 110px 110px 0 0;
        pointer-events: none;
    }

/* 内幅 */

.c-section__inner {
        position: relative;
        width: 100%;
        max-width: var(--width-main);
        margin: 0 auto;
    }

.c-section__inner--hero {
            max-width: var(--width-hero);
        }

.c-section__inner--wide {
            max-width: var(--width-news);
        }

.c-section__inner--compare {
            max-width: var(--width-compare);
        }

.c-section__inner--records {
            max-width: var(--width-records);
        }

.c-section__inner--read {
            max-width: var(--width-read);
        }

.c-section__inner--history {
            max-width: var(--width-history);
        }

.c-section__inner--narrow {
            max-width: var(--width-narrow);
        }

.c-section__inner--cta {
            max-width: var(--width-cta);
        }

/* 背景画像レイヤー */

.c-section__bg {
        position: absolute;
        inset: 0;
        z-index: -1;
        overflow: hidden;
        pointer-events: none;
    }

.c-section__bg img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

/* 見出し → コンテンツ間 */

.c-section__body {
        margin-top: min(calc(44 / var(--width-base) * 100vw), 44px);
    }

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

.c-section__body {
            margin-top: min(calc(28 / var(--width-base) * 100vw), 28px)
    }
        }

/* ===================================================================
  CSS information
  file name  :  c-header.css
  PC: 電話バー + 丸型 sticky ヘッダー / SP: 60px sticky バー + ハンバーガー
=================================================================== */


/* ---------------------------
telbar（PC のみ）
--------------------------- */

.c-telbar {
    position: relative;
    z-index: var(--z-telbar);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    padding: 0 var(--header-side);
}

.c-telbar__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 10px 20px;
        background: var(--color-lightest);
        border-radius: 0 0 10px 10px;
    }

.c-telbar__hours {
        font-size: 1.3rem;
        font-weight: 700;
        color: var(--color-text);
        white-space: nowrap;
    }


/* ---------------------------
header
--------------------------- */

.c-header {
    position: sticky;
    top: var(--header-top-pc);
    z-index: var(--z-header);
    margin: 8px var(--header-side) 0;
}

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

.c-header {
        top: 0;
        margin: 0
}
    }

.c-header__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: clamp(12px, 2vw, 24px);
        height: var(--header-h-pc);
        min-width: 0;
        padding: 0 clamp(28px, 3vw, 40px) 0 clamp(20px, 2.5vw, 32px);
        background: var(--color-lightest);
        border-radius: var(--radius-pill);
        -webkit-box-shadow: var(--shadow-header);
                box-shadow: var(--shadow-header);
    }

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

.c-header__inner {
            position: relative;
            z-index: 2;
            height: var(--header-h-sp);
            gap: 8px;
            padding: 0 12px 0 16px;
            border-radius: 0;
            -webkit-box-shadow: var(--shadow-header-sp);
                    box-shadow: var(--shadow-header-sp)
    }
        }

.c-header__logo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        color: var(--color-primary);
    }

.c-header__logo:hover {
            color: var(--color-primary);
        }

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

.c-header__logo {
            gap: 6px;
            -webkit-box-flex: 1;
                -ms-flex: 1 1 auto;
                    flex: 1 1 auto;
            min-width: 0
    }
        }

.c-header__mark {
        width: 38px;
        height: 38px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

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

.c-header__mark {
            width: 30px;
            height: 30px
    }
        }

/* 社名（PC: マークに対して上下中央。padding-top 1px で字面の中心を合わせる） */

.c-header__name {
        display: block;
        min-width: 0;
        padding-top: 1px;
        font-size: min(2.4rem, calc(24 / 1200 * 100vw)); /* 1200px 未満の PC はナビが収まるよう縮小 */
        font-weight: 900;
        line-height: 1;
        color: var(--color-primary);
        white-space: nowrap;
    }

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

.c-header__name {
            padding-top: 0;
            font-size: 1.3rem;
            line-height: 1.3
    }
        }

.c-header__nav {
        margin-left: auto;
        min-width: 0;
    }

.c-header__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: clamp(8px, calc(3.4vw - 23.5px), 22px); /* 1302px で 20.8px、768px 付近は 8px まで詰める */
    }

.c-header__link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        font-size: clamp(12px, 1.1vw, 15px);
        font-weight: 700;
        line-height: normal;
        color: var(--color-primary);
        white-space: nowrap;
    }

.c-header__link::before {
            content: "";
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--color-accent);
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-header__link.is-current {
            text-decoration: underline;
            text-decoration-thickness: 2px;
            text-underline-offset: 5px;
        }

.c-header__link:hover {
            color: var(--color-primary-hover);
        }

/* SP ハンバーガー */

.c-header__toggle {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 5px;
        width: 44px;
        height: 44px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        border-radius: 50%;
        background: var(--color-primary);
    }

.c-header__toggle-bar {
        display: block;
        width: 18px;
        height: 2px;
        background: var(--color-lightest);
        -webkit-transition: opacity .2s ease, -webkit-transform .2s ease;
        transition: opacity .2s ease, -webkit-transform .2s ease;
        transition: transform .2s ease, opacity .2s ease;
        transition: transform .2s ease, opacity .2s ease, -webkit-transform .2s ease;
    }

.c-header__toggle.is-open .c-header__toggle-bar:nth-child(1) {
            -webkit-transform: translateY(7px) rotate(45deg);
                    transform: translateY(7px) rotate(45deg);
        }

.c-header__toggle.is-open .c-header__toggle-bar:nth-child(2) {
            opacity: 0;
        }

.c-header__toggle.is-open .c-header__toggle-bar:nth-child(3) {
            -webkit-transform: translateY(-7px) rotate(-45deg);
                    transform: translateY(-7px) rotate(-45deg);
        }

/* ===================================================================
  CSS information
  file name  :  c-menu.css
  SP オーバーレイメニュー（sticky バー直下に absolute で重ねる。コンテンツを押し下げない）
=================================================================== */

.c-menu {
    position: absolute;
    left: 0;
    right: 0;
    top: var(--header-h-sp);
    z-index: 1;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 8px 20px 20px;
    background: var(--color-lightest);
    border-bottom: 1px solid var(--color-border-01);
    -webkit-box-shadow: var(--shadow-drawer);
            box-shadow: var(--shadow-drawer);
    visibility: hidden;
    opacity: 0;
    -webkit-transform: translateY(-6px);
            transform: translateY(-6px);
    -webkit-transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease;
    transition: opacity .2s ease, transform .2s ease, visibility .2s ease, -webkit-transform .2s ease;
}

.c-menu.is-open {
        visibility: visible;
        opacity: 1;
        -webkit-transform: none;
                transform: none;
    }

.c-menu__item {
        border-bottom: 1px solid var(--color-border-03);
    }

.c-menu__item:last-child {
            border-bottom: 0;
        }

.c-menu__link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        padding: 14px 0;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1.4;
        color: var(--color-primary);
    }

.c-menu__link::before {
            content: "";
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--color-accent);
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-menu .c-tel--menu {
        margin-top: 12px;
    }

/* ===================================================================
  CSS information
  file name  :  c-tel.css
  電話リンク（✆ グリフ + Poppins 番号）
=================================================================== */

.c-tel {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: var(--color-primary);
    font-family: var(--font-family-en);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    /* PC 電話バー */
    /* デザインはアイコンと番号の間が半角スペース（Poppins 700 のスペース幅 = .21em）・行高 26px */
}

.c-tel:hover {
        color: var(--color-primary);
    }

/* ✆ はグリフのインクが行ボックスの上寄りに描かれるため、
       各バリアントで top を実測値ぶん補正して数字と視覚的に揃える */

.c-tel__icon {
        position: relative;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-family: var(--font-family-primary);
        font-weight: 400;
        line-height: 1;
    }

.c-tel__hours {
        font-family: var(--font-family-primary);
        font-weight: 700;
    }

/* ✆ の vertical-align:-2px で行ボックスが下に 4px 伸び、番号は下端寄りになるため flex-end で揃える */

.c-tel--bar {
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
        gap: .21em;
        min-height: 26px;
        font-size: 2.2rem;
    }

.c-tel--bar .c-tel__icon {
            top: -5.5px;
            height: 22px;
            font-size: 38px;
        }

/* SP ヘッダー */

.c-tel--sp {
        gap: 2px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        font-size: 1.5rem;
    }

.c-tel--sp .c-tel__icon {
            top: -3.6px;
            width: 28px;
            height: 32px;
            font-size: 32px;
        }

/* SP メニュー内 */

.c-tel--menu {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 8px;
        padding: 14px;
        font-size: 2rem;
        background: var(--color-tel-bg);
        border-radius: var(--radius-image);
    }

.c-tel--menu .c-tel__icon {
            top: -3.75px;
            font-size: 28px;
        }

/* 共通 CTA（アイコンと番号の間は半角スペース = .21em） */

.c-tel--cta {
        gap: .21em;
        font-size: clamp(26px, 3.4vw, 36px);
        color: var(--color-lightest);
    }

.c-tel--cta:hover {
            color: var(--color-lightest);
        }

.c-tel--cta .c-tel__icon {
            top: -6.4px;
            height: 30px;
            font-size: clamp(34px, 4.4vw, 48px);
        }

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

.c-tel--cta {
            font-size: 2.8rem
    }
            .c-tel--cta .c-tel__icon {
                top: -6.25px;
                font-size: 36px;
            }
        }

/* サンプル CTA はデザインが固定 36px / 48px（SP も同値） */

.c-cta--sample .c-tel--cta {
        font-size: 3.6rem;
    }

.c-cta--sample .c-tel--cta .c-tel__icon {
            top: -6.4px;
            font-size: 48px;
        }

/* トップ・腸菌力シリーズの SP は flex + gap 6px */

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

.c-cta--sample.c-cta--compact-sp .c-tel--cta {
            gap: 6px;
            font-size: 2.8rem
    }
            .c-cta--sample.c-cta--compact-sp .c-tel--cta .c-tel__icon {
                top: -6.25px;
                font-size: 36px;
            }
        }

/* お知らせ サイドバー */

.c-tel--side {
        gap: 6px;
        font-size: 2.2rem;
    }

/* お問い合わせ 電話カード */

.c-tel--card {
        font-size: clamp(28px, 3vw, 36px);
        letter-spacing: .02em;
        line-height: 1.1;
    }

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

.c-tel--card {
            font-size: 2.4rem
    }
        }

/* ===================================================================
  CSS information
  file name  :  c-hero.css
  下層ページのヒーロー（PC は -146px でヘッダー下に潜り込む）
=================================================================== */

.c-hero {
    position: relative;
    min-height: 600px;
    margin-top: var(--header-pull-pc);
    overflow: hidden;
    background: var(--color-hero-base);
    color: var(--color-lightest);
}

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

.c-hero {
        min-height: 440px;
        margin-top: 0
}
    }

.c-hero--lg {
        min-height: 700px;
    }

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

.c-hero--lg {
            min-height: 640px
    }
        }

.c-hero--sm {
        min-height: 520px;
    }

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

.c-hero--sm {
            min-height: 400px
    }
        }

.c-hero--product {
        min-height: 720px;
    }

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

.c-hero--product {
            min-height: 600px
    }
        }

.c-hero__bg {
        position: absolute;
        inset: 0;
    }

/* スウッシュ（MC・M2）は左寄せ固定のため、写真用の object-position を当てない */

.c-hero__bg img:not(.c-hero__swoosh) {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--hero-pos, center);
               object-position: var(--hero-pos, center);
        }

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

.c-hero__bg img:not(.c-hero__swoosh) {
                -o-object-position: var(--hero-pos-sp, var(--hero-pos, center));
                   object-position: var(--hero-pos-sp, var(--hero-pos, center))
        }
            }

.c-hero--product .c-hero__img {
        -o-object-fit: contain;
           object-fit: contain;
        -o-object-position: right bottom;
           object-position: right bottom;
    }

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

.c-hero--product .c-hero__img {
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: 70% center;
               object-position: 70% center
    }
        }

.c-hero__swoosh {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: left center;
           object-position: left center;
        -webkit-mask-image: -webkit-gradient(linear, left top, right top, color-stop(0, #000), color-stop(22%, #000), color-stop(30%, rgba(0, 0, 0, .9)), color-stop(38%, rgba(0, 0, 0, .5)), color-stop(46%, rgba(0, 0, 0, .15)), color-stop(54%, transparent));
        -webkit-mask-image: linear-gradient(90deg, #000 0, #000 22%, rgba(0, 0, 0, .9) 30%, rgba(0, 0, 0, .5) 38%, rgba(0, 0, 0, .15) 46%, transparent 54%);
        mask-image: -webkit-gradient(linear, left top, right top, color-stop(0, #000), color-stop(22%, #000), color-stop(30%, rgba(0, 0, 0, .9)), color-stop(38%, rgba(0, 0, 0, .5)), color-stop(46%, rgba(0, 0, 0, .15)), color-stop(54%, transparent));
        mask-image: linear-gradient(90deg, #000 0, #000 22%, rgba(0, 0, 0, .9) 30%, rgba(0, 0, 0, .5) 38%, rgba(0, 0, 0, .15) 46%, transparent 54%);
    }

.c-hero__overlay {
        position: absolute;
        inset: 0;
        background: var(--gradient-hero-pc);
        pointer-events: none;
    }

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

.c-hero__overlay {
            background: var(--gradient-hero-sp)
    }
        }

.c-hero--grad-product .c-hero__overlay {
        background: var(--gradient-hero-pc-product);
    }

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

.c-hero--grad-product .c-hero__overlay {
            background: var(--gradient-hero-sp)
    }
        }

.c-hero--grad-privacy .c-hero__overlay {
        background: var(--gradient-hero-pc-privacy);
    }

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

.c-hero--grad-privacy .c-hero__overlay {
            background: var(--gradient-hero-sp)
    }
        }

/* 製品単品（右下）: 画面幅に比例（最小 110px・最大 200px）。右端付近は次セクションのアーチが浅いため下端 64px
       （MC は --product-bottom / --product-bottom-sp、M2 は --product-w-sp をデータで上書き） */

.c-hero__product {
        position: absolute;
        right: 3%;
        bottom: var(--product-bottom, 64px);
        z-index: 1;
        width: calc(clamp(110px, 13.5vw, 200px) * var(--product-scale, 1));
        height: auto;
        -webkit-filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .35));
                filter: drop-shadow(0 12px 24px rgba(0, 0, 0, .35));
        pointer-events: none;
    }

/* SP: ボタン下の余白（padding-bottom 150px）の右側に収める */

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

.c-hero__product {
            right: 16px;
            bottom: var(--product-bottom-sp, 100px);
            width: var(--product-w-sp, min(calc(96px * var(--product-scale, 1)), 124px)) /* ボタンに重ならない上限 */
    }
        }

.c-hero__catch {
        position: absolute;
        right: 2%;
        top: 24%;
        width: min(28%, 360px);
        height: auto;
    }

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

.c-hero__catch {
            display: none
    }
        }

.c-hero__inner {
        position: relative;
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        max-width: var(--width-hero);
        margin: 0 auto;
        padding: 230px 40px 190px;
    }

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

.c-hero__inner {
            padding: 150px 20px 110px
    }
        }

.c-hero--md .c-hero__inner {
        padding: 230px 40px 140px;
    }

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

.c-hero--md .c-hero__inner {
            padding: 84px 20px 120px
    }
        }

.c-hero--sm .c-hero__inner {
        padding: 206px 40px 130px;
    }

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

.c-hero--sm .c-hero__inner {
            padding: 72px 20px 110px
    }
        }

.c-hero--product .c-hero__inner {
        padding: 200px 40px 180px;
    }

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

.c-hero--product .c-hero__inner {
            padding: 56px 20px 150px
    }
        }

.c-hero__breadcrumb {
        margin-bottom: 20px;
        font-size: 1.3rem;
        color: var(--color-lightest);
    }

.c-hero__breadcrumb a {
            color: var(--color-lightest);
        }

.c-hero__breadcrumb a:hover {
                color: var(--color-lightest);
                text-decoration: underline;
            }

/* デザインは「ホーム ／ 現在ページ」のテキスト区切り（区切りは不透明、現在ページのみ .85） */

.c-hero__crumbs {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }

.c-hero__crumbs li + li::before {
            content: " ／ ";
            white-space: pre;
        }

.c-hero__crumbs li:last-child span {
            opacity: .85;
        }

.c-hero__body {
        max-width: var(--hero-body-max, min(640px, 56%));
    }

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

.c-hero__body {
            max-width: 100%
    }
        }

.c-hero--product .c-hero__body {
        max-width: var(--hero-body-max, min(600px, 56%));
    }

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

.c-hero--product .c-hero__body {
            max-width: 100%
    }
        }

.c-hero__label {
        display: inline-block;
        padding: 8px 24px;
        font-size: 1.3rem;
        font-weight: 700;
        letter-spacing: .1em;
        color: var(--color-primary);
        background: var(--color-lightest);
        border-radius: var(--radius-pill);
    }

/* デザインはブラウザ既定の sup（vertical-align: super）。normalize の top 補正を打ち消す */

.c-hero__label sup {
            top: 0;
            font-size: 9px;
            line-height: normal;
            vertical-align: super;
        }

/* 製品ページ: タイプ（白ピル）+ 原料バッジ（透過白枠ピル） */

.c-hero__pills {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
    }

.c-hero__origin {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 8px;
        padding: 7px 16px 7px 12px;
        font-size: 1.3rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-white-a14);
        border: 1px solid var(--color-white-a80);
        border-radius: var(--radius-pill);
    }

.c-hero__origin-icon {
        width: 18px;
        height: 18px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        -webkit-filter: brightness(0) invert(1);
                filter: brightness(0) invert(1);
    }

.c-hero__title {
        margin-top: 22px;
        font-size: var(--font-size-h1);
        font-weight: 900;
        line-height: 1.4;
        letter-spacing: .06em;
        color: var(--color-lightest);
        word-break: auto-phrase;
    }

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

.c-hero__title {
            letter-spacing: .02em
    }
        }

.c-hero--nowrap .c-hero__title {
        white-space: nowrap;
        word-break: normal;
    }

@media only screen and (min-width: 768px) {

.c-hero--nowrap-pc .c-hero__title {
            white-space: nowrap;
            word-break: normal
    }
        }

.c-hero__em {
        color: var(--color-light-green);
    }

.c-hero__lead {
        margin-top: 20px;
        font-size: 1.6rem;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-lightest);
        text-align: left;
    }

/* 吹き出し（ボタンの上） */

.c-hero__badge {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        margin-top: 36px;
    }

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

.c-hero__badge {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex
    }
        }

.c-hero__badge-pill {
        padding: 6px 16px;
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-lightest);
        border: 1px solid var(--color-lightest);
        border-radius: var(--radius-pill);
        white-space: nowrap;
    }

.c-hero__badge-arrow {
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 7px solid var(--color-lightest);
    }

.c-hero__btns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 20px;
        margin-top: 36px;
    }

.c-hero__btns--badged {
            margin-top: 12px;
        }

/* 吹き出しを 1 つ目のボタンの上・左右中央に置く（badge_center）。ボタンは下端で揃える */

.c-hero__btns--badge-center {
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
    }

/* SP はボタンが縦積み（全幅）になるため伸ばす */

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

.c-hero__btns--badge-center {
            -webkit-box-align: stretch;
                -ms-flex-align: stretch;
                    align-items: stretch
    }
        }

.c-hero__btn-badged {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: var(--gap-hero-badge);
    }

.c-hero__btn-badged > .c-btn {
            -ms-flex-item-align: stretch;
                align-self: stretch;
        }

.c-hero__btn-badged .c-hero__badge {
            margin-top: 0;
        }

/* 吹き出しが SP のみの場合、PC のボタン上余白は通常値 */

@media only screen and (min-width: 768px) {

.c-hero__badge.sp-only + .c-hero__btns {
            margin-top: 36px
    }
        }

/* 製品ページ（MC / M2）: SP もデザインは PC と同値 */

.c-hero.c-hero--product .c-hero__label {
            font-size: 1.4rem;
            letter-spacing: 0;
        }

.c-hero.c-hero--product .c-hero__title {
            margin-top: 24px;
            line-height: 1.35;
        }

.c-hero.c-hero--product .c-hero__lead {
            margin-top: 24px;
        }

.c-hero.c-hero--product .c-hero__btns {
            gap: 16px;
        }

/* 腸菌力シリーズ（lg）: PC は製品ページと同じ詰め、SP は専用レイアウト */

.c-hero.c-hero--lg .c-hero__label {
            font-size: 1.4rem;
            letter-spacing: 0;
        }

.c-hero.c-hero--lg .c-hero__label sup {
                font-size: 9px;
            }

.c-hero.c-hero--lg .c-hero__title {
            margin-top: 24px;
        }

.c-hero.c-hero--lg .c-hero__lead {
            margin-top: 24px;
        }

@media only screen and (max-width: 767px) {
            .c-hero.c-hero--lg .c-hero__breadcrumb {
                margin-bottom: 16px;
                font-size: 1.2rem;
            }
            .c-hero.c-hero--lg .c-hero__label {
                padding: 6px 16px;
                font-size: 1.2rem;
            }
                .c-hero.c-hero--lg .c-hero__label sup {
                    font-size: 8px;
                }
            .c-hero.c-hero--lg .c-hero__title {
                margin-top: 16px;
                word-break: normal;
            }
            .c-hero.c-hero--lg .c-hero__lead {
                margin-top: 14px;
                font-size: 1.4rem;
                line-height: 1.8;
                letter-spacing: 0;
            }
            .c-hero.c-hero--lg .c-hero__badge {
                margin-top: 22px;
            }
            .c-hero.c-hero--lg .c-hero__btns {
                -webkit-box-orient: vertical;
                -webkit-box-direction: normal;
                    -ms-flex-direction: column;
                        flex-direction: column;
                gap: 10px;
                margin-top: 28px;
            }
                .c-hero.c-hero--lg .c-hero__btns--badged {
                    margin-top: 20px;
                }
                .c-hero.c-hero--lg .c-hero__btns .c-btn {
                    gap: 12px;
                }
                    .c-hero.c-hero--lg .c-hero__btns .c-btn .c-btn__icon {
                        width: 24px;
                        height: 24px;
                    }
                .c-hero.c-hero--lg .c-hero__btns .c-btn--primary {
                    min-width: 0;
                    padding: 18px 18px 18px 22px;
                    font-size: 1.6rem;
                }
                .c-hero.c-hero--lg .c-hero__btns .c-btn--outline-dark {
                    min-width: 0;
                    padding: 16px 17px 16px 21px;
                    font-size: 1.5rem;
                }
                    .c-hero.c-hero--lg .c-hero__btns .c-btn--outline-dark .c-btn__icon {
                        width: 26px;
                        height: 26px;
                    }
        }

/* ===================================================================
  CSS information
  file name  :  c-fv.css
  トップ FV スライダー（slick / fade / 6 秒）
=================================================================== */

.c-fv {
    position: relative;
    min-height: 760px;
    margin-top: var(--header-pull-pc);
    overflow: hidden;
    color: var(--color-lightest);
    background: var(--color-hero-base);
}

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

.c-fv {
        margin-top: 0
}
    }

.c-fv__slider {
        position: relative;
    }

.c-fv .slick-list,
    .c-fv .slick-track {
        height: 100%;
    }

.c-fv__slide {
        position: relative;
        min-height: 760px;
    }

.c-fv__bg {
        position: absolute;
        inset: 0;
    }

.c-fv__bg img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--fv-pos, center);
               object-position: var(--fv-pos, center);
        }

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

.c-fv__bg img {
                -o-object-position: var(--fv-pos-sp, var(--fv-pos, center));
                   object-position: var(--fv-pos-sp, var(--fv-pos, center))
        }
            }

.c-fv__overlay {
        position: absolute;
        inset: 0;
        background: var(--gradient-hero-pc-top);
        pointer-events: none;
    }

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

.c-fv__overlay {
            background: var(--gradient-hero-sp-top)
    }
        }

.c-fv__inner {
        position: relative;
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        max-width: var(--width-hero);
        margin: 0 auto;
        padding: 210px 40px 160px;
    }

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

.c-fv__inner {
            padding: 180px 20px 150px
    }
        }

/* デザインはスライド本文を絶対配置で重ねるため、本文の高さは固定（はみ出しは可） */

.c-fv__body {
        max-width: 620px;
        height: 470px;
    }

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

.c-fv__body {
            max-width: 100%;
            height: 410px
    }
        }

.c-fv__label {
        display: inline-block;
        padding: 8px 24px;
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border-radius: var(--radius-pill);
    }

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

.c-fv__label {
            padding: 6px 16px;
            font-size: 1.2rem
    }
        }

/* デザインはブラウザ既定の sup（vertical-align: super）。normalize の top 補正を打ち消す */

.c-fv__label sup {
            top: 0;
            font-size: 9px;
            line-height: normal;
            vertical-align: super;
        }

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

.c-fv__label sup {
                font-size: 8px
        }
            }

.c-fv__title {
        margin-top: 24px;
        font-size: 5.2rem;
        font-weight: 900;
        line-height: 1.35;
        letter-spacing: .06em;
        color: var(--color-lightest);
        word-break: auto-phrase;
    }

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

.c-fv__title {
            margin-top: 16px;
            font-size: 3.2rem;
            line-height: 1.4;
            letter-spacing: .04em;
            word-break: normal
    }
        }

.c-fv__lead {
        max-width: 480px;
        margin-top: 24px;
        font-size: 1.6rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

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

.c-fv__lead {
            max-width: none;
            margin-top: 14px;
            font-size: 1.4rem;
            line-height: 1.8;
            letter-spacing: 0
    }
        }

.c-fv__btns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: flex-end;
        gap: 24px;
        margin-top: 36px;
    }

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

.c-fv__btns {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: stretch;
                -ms-flex-align: stretch;
                    align-items: stretch;
            gap: 10px;
            margin-top: 20px
    }
        }

.c-fv__btn-group {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
    }

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

.c-fv__btn-group {
            -webkit-box-align: stretch;
                -ms-flex-align: stretch;
                    align-items: stretch
    }
        }

.c-fv__btn-group .c-btn {
            margin-top: 6px;
        }

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

.c-fv__btn-group .c-btn {
                width: 100%;
                margin-top: 0
        }
            }

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

.c-fv__btn-group .c-fv__badge + .c-btn {
                margin-top: 20px
        }
            }

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

.c-fv__btn-group .c-fv__badge.pc-only + .c-btn {
                margin-top: 0
        }
            }

.c-fv .c-btn__icon {
        width: 24px;
        height: 24px;
    }

/* デザインの min-width は content-box（+ 左右 padding 48px） */

.c-fv .c-btn--primary,
    .c-fv .c-btn--orange,
    .c-fv__btn-green {
        min-width: 288px;
        padding: 24px 20px 24px 28px;
        font-size: 1.8rem;
    }

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

.c-fv .c-btn--primary,
    .c-fv .c-btn--orange,
    .c-fv__btn-green {
            min-width: 0;
            gap: 12px;
            padding: 18px 18px 18px 22px;
            font-size: 1.6rem
    }
        }

.c-fv__btn-green {
        border-radius: var(--radius-btn);
    }

@media only screen and (min-width: 768px) {

.c-fv__btn-green {
            min-width: 328px
    }
        }

.c-fv__btn-group:has(.c-fv__btn-green) .c-btn {
        margin-top: 0;
    }

.c-fv__badge {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -ms-flex-item-align: center;
            align-self: center;
    }

.c-fv__badge-pill {
        padding: 6px 16px;
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-lightest);
        border: 1px solid var(--color-lightest);
        border-radius: var(--radius-pill);
        white-space: nowrap;
    }

.c-fv__badge-arrow {
        width: 0;
        height: 0;
        border-left: 6px solid transparent;
        border-right: 6px solid transparent;
        border-top: 7px solid var(--color-lightest);
    }

/* コントロール（ドット + 矢印） */

.c-fv__controls {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 104px;
        z-index: 20;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        pointer-events: none;
    }

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

.c-fv__controls {
            bottom: 76px
    }
        }

.c-fv__controls-inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        gap: 20px;
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        width: 100%;
        max-width: var(--width-hero);
        padding: 0 40px;
    }

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

.c-fv__controls-inner {
            padding: 0 20px
    }
        }

.c-fv__dots {
        pointer-events: auto;
    }

.c-fv .dots-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
    }

.c-fv .dots-wrap li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
        }

.c-fv .dots-wrap button {
            width: 10px;
            height: 10px;
            font-size: 0;
            background: var(--color-white-a45);
            border-radius: var(--radius-pill);
            -webkit-transition: var(--trans-dot);
            transition: var(--trans-dot);
        }

.c-fv .dots-wrap .slick-active button {
            width: 38px;
            background: var(--color-lightest);
        }

.c-fv__arrows {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        gap: 10px;
        pointer-events: auto;
    }

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

.c-fv__arrows {
            gap: 8px
    }
        }

.c-fv .slide-arrow {
        width: 44px;
        height: 44px;
        font-family: Arial, sans-serif;
        font-size: 15px;
        line-height: normal;
        color: var(--color-lightest);
        background: var(--color-white-a12);
        border: 1px solid var(--color-white-a70);
        border-radius: 50%;
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-fv .slide-arrow:hover {
            background: var(--color-white-a25);
        }

/* SP: 薄い緑のグラデーションに加え、写真の上の白い文字・吹き出し・ドット・矢印に薄い影を付けて読みやすくする */

@media only screen and (max-width: 767px) {
        .c-fv .c-fv__title,
        .c-fv .c-fv__lead {
            text-shadow: var(--shadow-fv-text);
        }
        .c-fv .c-fv__badge,
        .c-fv .c-fv__dots,
        .c-fv .c-fv__arrows {
            -webkit-filter: drop-shadow(var(--shadow-fv-drop));
                    filter: drop-shadow(var(--shadow-fv-drop));
        }
    }

/* ===================================================================
  CSS information
  file name  :  c-splash.css
  スプラッシュ（トップの初回表示のみ）
  ロゴの輪 → 帯 2 本を描画 → 社名・タグライン → 白いシートがアーチ形の下辺で持ち上がる
=================================================================== */

.c-splash {
    --splash-arch: 110px;
    position: fixed;
    inset: 0;
    z-index: var(--z-splash);
    overflow: hidden;
    /* JS が動かない場合の保険: 6 秒後に自動で消える（通常は script.js が先に取り除く） */
    -webkit-animation: c-splash-fallback .4s ease 6s forwards;
            animation: c-splash-fallback .4s ease 6s forwards;
}

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

.c-splash {
        --splash-arch: 60px
}
    }

/* 白いシート。下辺はサイトのセクションと同じ楕円アーチ（画面外に置き、持ち上がる時に見える） */

.c-splash__sheet {
        position: absolute;
        top: 0;
        left: -15%;
        right: -15%;
        display: grid;
        place-items: center;
        height: calc(100% + var(--splash-arch));
        padding-bottom: var(--splash-arch);
        background: var(--color-lightest);
        border-radius: 0 0 50% 50% / 0 0 var(--splash-arch) var(--splash-arch);
        -webkit-transition: -webkit-transform .8s cubic-bezier(.7, 0, .2, 1) .12s;
        transition: -webkit-transform .8s cubic-bezier(.7, 0, .2, 1) .12s;
        transition: transform .8s cubic-bezier(.7, 0, .2, 1) .12s;
        transition: transform .8s cubic-bezier(.7, 0, .2, 1) .12s, -webkit-transform .8s cubic-bezier(.7, 0, .2, 1) .12s;
    }

.c-splash__lockup {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        text-align: center;
        -webkit-transition: opacity .3s ease, -webkit-transform .3s ease;
        transition: opacity .3s ease, -webkit-transform .3s ease;
        transition: opacity .3s ease, transform .3s ease;
        transition: opacity .3s ease, transform .3s ease, -webkit-transform .3s ease;
    }

.c-splash__mark {
        display: block;
        width: 88px;
        height: 88px;
    }

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

.c-splash__mark {
            width: 72px;
            height: 72px
    }
        }

/* 輪: 上から時計回りに描く */

.c-splash__ring {
        fill: none;
        stroke: var(--color-logo);
        stroke-width: 5;
        stroke-dasharray: 1;
        stroke-dashoffset: 1;
        -webkit-transform: rotate(-90deg);
                transform: rotate(-90deg);
        transform-box: fill-box;
        -webkit-transform-origin: center;
                transform-origin: center;
        -webkit-animation: c-splash-draw .7s cubic-bezier(.65, 0, .35, 1) .1s forwards;
                animation: c-splash-draw .7s cubic-bezier(.65, 0, .35, 1) .1s forwards;
    }

/* 帯: 左から伸びる（上 → 下の順） */

.c-splash__bar {
        fill: var(--color-logo);
        -webkit-transform: scaleX(0);
                transform: scaleX(0);
        transform-box: fill-box;
        -webkit-transform-origin: left center;
                transform-origin: left center;
        -webkit-animation: c-splash-bar .4s cubic-bezier(.3, .7, .2, 1) .6s forwards;
                animation: c-splash-bar .4s cubic-bezier(.3, .7, .2, 1) .6s forwards;
    }

.c-splash__bar--lower {
            -webkit-animation-delay: .72s;
                    animation-delay: .72s;
        }

.c-splash__name {
        margin-top: 22px;
        font-size: 2.4rem;
        font-weight: 900;
        letter-spacing: .08em;
        color: var(--color-primary);
        opacity: 0;
        -webkit-animation: c-splash-text .5s ease .85s forwards;
                animation: c-splash-text .5s ease .85s forwards;
    }

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

.c-splash__name {
            margin-top: 18px;
            font-size: 2rem
    }
        }

.c-splash__tagline {
        margin-top: 8px;
        font-size: 1.3rem;
        letter-spacing: .04em;
        color: var(--color-text-sub);
        opacity: 0;
        -webkit-animation: c-splash-text .5s ease 1s forwards;
                animation: c-splash-text .5s ease 1s forwards;
    }

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

.c-splash__tagline {
            font-size: 1.2rem
    }
        }

/* 退場: 文字を先に消し、シートを持ち上げる */

.c-splash.is-leaving {
        pointer-events: none;
    }

.c-splash.is-leaving .c-splash__lockup {
            opacity: 0;
            -webkit-transform: translateY(-12px);
                    transform: translateY(-12px);
        }

.c-splash.is-leaving .c-splash__sheet {
            -webkit-transform: translateY(-100%);
                    transform: translateY(-100%);
        }

/* 同一セッションの 2 回目以降は表示しない（header.php のインラインスクリプトが付与） */
.is-splash-skip .c-splash {
    display: none;
}

/* 表示中はページをスクロールさせない */
.is-splash-lock {
    overflow: hidden;
}

/* 動きを減らす設定: 描画アニメーションなしで表示し、フェードで消える */
@media (prefers-reduced-motion: reduce) {
        .c-splash .c-splash__ring,
        .c-splash .c-splash__bar,
        .c-splash .c-splash__name,
        .c-splash .c-splash__tagline {
            -webkit-animation: none;
                    animation: none;
        }
        .c-splash .c-splash__ring {
            stroke-dasharray: none;
        }
        .c-splash .c-splash__bar {
            -webkit-transform: none;
                    transform: none;
        }
        .c-splash .c-splash__name,
        .c-splash .c-splash__tagline {
            opacity: 1;
        }
        .c-splash .c-splash__sheet {
            -webkit-transition: none;
            transition: none;
        }
        .c-splash.is-leaving {
            opacity: 0;
            -webkit-transition: opacity .4s ease;
            transition: opacity .4s ease;
        }
            .c-splash.is-leaving .c-splash__sheet {
                -webkit-transform: none;
                        transform: none;
            }
}

/* 描き終わりで破線指定を外し、輪の始点と終点の継ぎ目（髪の毛ほどの隙間）を消す */
@-webkit-keyframes c-splash-draw {
    99.9% {
        stroke-dasharray: 1;
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dasharray: none;
        stroke-dashoffset: 0;
    }
}
@keyframes c-splash-draw {
    99.9% {
        stroke-dasharray: 1;
        stroke-dashoffset: 0;
    }
    100% {
        stroke-dasharray: none;
        stroke-dashoffset: 0;
    }
}

@-webkit-keyframes c-splash-bar {
    to {
        -webkit-transform: scaleX(1);
                transform: scaleX(1);
    }
}

@keyframes c-splash-bar {
    to {
        -webkit-transform: scaleX(1);
                transform: scaleX(1);
    }
}

@-webkit-keyframes c-splash-text {
    from {
        opacity: 0;
        -webkit-transform: translateY(8px);
                transform: translateY(8px);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
                transform: none;
    }
}

@keyframes c-splash-text {
    from {
        opacity: 0;
        -webkit-transform: translateY(8px);
                transform: translateY(8px);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
                transform: none;
    }
}

@-webkit-keyframes c-splash-fallback {
    to {
        visibility: hidden;
        opacity: 0;
    }
}

@keyframes c-splash-fallback {
    to {
        visibility: hidden;
        opacity: 0;
    }
}

/* ===================================================================
  CSS information
  file name  :  c-heading.css
  セクション見出し: タグ pill → h2（緑 / 赤）→ 40×3 緑ルール → リード
=================================================================== */

.c-heading {
    text-align: center;
}

.c-heading--left {
        text-align: left;
    }

.c-heading__tag {
        display: inline-block;
        padding: 6px 20px;
        font-size: 1.3rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
    }

.c-heading__title {
        margin-top: 20px;
        font-size: var(--font-size-h2);
        font-weight: 900;
        line-height: 1.5;
        letter-spacing: .06em;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-heading--lg .c-heading__title {
        font-size: var(--font-size-h2-lg);
    }

.c-heading--red .c-heading__title {
        color: var(--color-red);
    }

/* 石灰・採石（FLOW & RECORDS / ITEMS）: 大きめ・濃い緑の h2、緑のルール */

.c-heading--ls .c-heading__title {
            font-size: var(--font-size-h2-ls);
            line-height: 1.4;
            color: var(--color-heading-dark);
        }

.c-heading--ls .c-heading__rule {
            background: var(--color-primary);
        }

.c-heading--ls .c-heading__lead {
            margin-top: 18px;
        }

.c-heading__em {
        color: var(--color-red);
    }

.c-heading__small {
        font-size: .7em;
    }

.c-heading--red .c-heading__em--green,
    .c-heading__em--green {
        color: var(--color-primary);
    }

.c-heading__title--strokes {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 22px;
    }

.c-heading__stroke {
        position: relative;
        top: -14px;
        width: 52px;
        height: 52px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-heading__stroke--flip {
            -webkit-transform: scaleX(-1);
                    transform: scaleX(-1);
        }

.c-heading__rule {
        display: block;
        width: 40px;
        height: 3px;
        margin: 18px auto 0;
        border-radius: 2px;
        background: var(--color-accent);
    }

.c-heading--left .c-heading__rule {
        margin-left: 0;
    }

@media only screen and (min-width: 768px) {

.c-heading--rule-sp .c-heading__rule {
            display: none
    }
        }

.c-heading__lead {
        max-width: var(--lead-max, 760px);
        margin: 18px auto 0;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-text);
        text-align: center;
    }

.c-heading__lead--left {
            text-align: left;
        }

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

.c-heading__lead--sp-left {
                text-align: left
        }
            }

.c-heading__lead--lg {
            margin-top: 20px;
            font-size: 1.6rem;
            letter-spacing: 0;
        }

.c-heading--lead-mt16 .c-heading__lead {
        margin-top: 16px;
    }

.c-heading--left .c-heading__lead {
        text-align: left;
        margin-left: 0;
    }

/* 左右に可変ルールを持つ見出し（MC「3段階の防衛ライン」/ CAUTION） */

.c-heading--bars .c-heading__title {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 16px;
        white-space: nowrap;
        word-break: normal;
    }

.c-heading--bars .c-heading__title::before,
        .c-heading--bars .c-heading__title::after {
            content: "";
            -webkit-box-flex: 1;
                -ms-flex: 1 1 0px;
                    flex: 1 1 0;
            max-width: 120px;
            height: 2px;
            background: var(--color-primary);
        }

.c-heading--bars-sm .c-heading__title::before,
    .c-heading--bars-sm .c-heading__title::after {
        max-width: 56px;
        background: var(--color-red);
    }

.c-heading__sub {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 16px;
        margin-top: 10px;
        font-family: var(--font-family-en);
        font-size: 1.3rem;
        font-weight: 600;
        letter-spacing: .3em;
        color: var(--color-caution-rule);
    }

.c-heading__sub::before,
        .c-heading__sub::after {
            content: "";
            width: 80px;
            height: 1px;
            background: currentColor;
        }

.c-heading__icon {
        display: block;
        width: 64px;
        height: 64px;
        margin: 0 auto -8px;
    }

.c-heading__icon + .c-heading__title {
            margin-top: 0;
        }


/* トップ・腸菌力シリーズは SP 専用マークアップ（タグ 12px / h2 26px / リード 14px 左揃え） */

@media only screen and (max-width: 767px) {
        .c-page-home .c-heading .c-heading__tag, .c-page-gut-health .c-heading .c-heading__tag {
            padding: 5px 16px;
            font-size: 1.2rem;
        }
        .c-page-home .c-heading .c-heading__title, .c-page-gut-health .c-heading .c-heading__title {
            margin-top: 14px;
            font-size: 2.6rem;
            letter-spacing: .04em;
        }
        .c-page-home .c-heading .c-heading__title--strokes, .c-page-gut-health .c-heading .c-heading__title--strokes {
            gap: 14px;
        }
        .c-page-home .c-heading .c-heading__rule, .c-page-gut-health .c-heading .c-heading__rule {
            margin-top: 14px;
        }
        .c-page-home .c-heading .c-heading__stroke, .c-page-gut-health .c-heading .c-heading__stroke {
            top: -10px;
            width: 36px;
            height: 36px;
        }
        .c-page-home .c-heading .c-heading__lead, .c-page-gut-health .c-heading .c-heading__lead {
            margin-top: 14px;
            font-size: 1.4rem;
            letter-spacing: .02em;
            text-align: left;
        }
    }

/* ===================================================================
  CSS information
  file name  :  c-btn.css
  primary（赤）/ orange / green / outline-dark（白枠）/ outline-green / pill
  ここはデザインの基本値のみ。SP でサイズが変わる文脈（トップ・腸菌力シリーズの SP、見積 CTA 等）は
  各コンポーネント側（_c-hero / _c-cta / _c-fv / _c-card 等）で上書きする
=================================================================== */

.c-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    gap: 16px;
    font-weight: 700;
    line-height: normal;
    text-align: left;
    border-radius: var(--radius-btn);
    cursor: pointer;
    -webkit-transition: var(--trans-hover);
    transition: var(--trans-hover);
}

.c-btn__label {
        display: block;
        min-width: 0;
    }

.c-btn__icon {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 26px;
        height: 26px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        font-size: 14px;
        line-height: 1;
        color: var(--color-red);
        background: var(--color-lightest);
        border-radius: var(--radius-btn-sm);
    }

.c-btn__pdf {
        width: 20px;
        height: 24px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-btn__arrow {
        margin-left: .25em;
    }

.c-btn--block {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: 100%;
    }

/* primary（赤） */

.c-btn--primary {
        padding: 22px 20px 22px 28px;
        font-size: 1.8rem;
        color: var(--color-lightest);
        background: var(--color-red);
    }

.c-btn--primary:hover {
            color: var(--color-lightest);
            background: var(--color-red-hover);
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

/* orange（トップ FV のみ） */

.c-btn--orange {
        padding: 22px 20px 22px 28px;
        font-size: 1.8rem;
        color: var(--color-lightest);
        background: var(--color-orange);
    }

.c-btn--orange .c-btn__icon {
            color: var(--color-orange-hover);
        }

.c-btn--orange:hover {
            color: var(--color-lightest);
            background: var(--color-orange-hover);
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

/* green（詳しく見る） */

.c-btn--green {
        padding: 14px 20px 14px 28px;
        font-size: 1.5rem;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-btn-sm);
    }

.c-btn--green .c-btn__icon {
            width: 24px;
            height: 24px;
            color: var(--color-primary);
        }

.c-btn--green:hover {
            color: var(--color-lightest);
            background: var(--color-primary-hover);
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

/* outline-dark（暗背景上の白枠）。丸アイコンはデザインが content-box（28px + 枠 1px）のため 30px */

.c-btn--outline-dark {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        padding: 16px 24px 16px 32px;
        font-size: 1.6rem;
        color: var(--color-lightest);
        border: 1px solid var(--color-white-a80);
    }

.c-btn--outline-dark .c-btn__icon {
            width: 30px;
            height: 30px;
            font-size: 13px;
            color: var(--color-lightest);
            background: transparent;
            border: 1px solid var(--color-lightest);
            border-radius: 50%;
        }

.c-btn--outline-dark .c-btn__pdf {
            -webkit-filter: brightness(0) invert(1);
                    filter: brightness(0) invert(1);
        }

.c-btn--outline-dark:hover {
            color: var(--color-lightest);
            background: var(--color-white-a12);
        }

/* outline-green（カタログ PDF 等） */

.c-btn--outline-green {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 10px;
        padding: 18px 36px;
        font-size: 1.5rem;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-btn-outline);
    }

.c-btn--outline-green .c-btn__icon {
            color: var(--color-primary);
            background: transparent;
        }

.c-btn--outline-green:hover {
            color: var(--color-primary);
            background: var(--color-pale-01);
        }

.c-btn--outline-green.c-btn--strong {
            gap: 14px;
            font-size: 1.7rem;
            background: var(--color-white-a95);
            border: 1.5px solid var(--color-primary);
        }

/* pill（一覧を見る） */

.c-btn--pill {
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 14px;
        padding: 18px 44px;
        font-size: 1.6rem;
        color: var(--color-primary);
        background: var(--color-white-a95);
        border: 1.5px solid var(--color-primary);
        border-radius: var(--radius-pill);
    }

.c-btn--pill .c-btn__arrow {
            margin-left: 0;
        }

.c-btn--pill:hover {
            color: var(--color-primary);
            background: var(--color-pale-01);
        }

/* サイズ: md（下層ヒーロー）。デザインの min-width は content-box（+ padding・枠）のため実寸で指定 */

.c-btn--md.c-btn--primary {
            min-width: 298px;
            padding: 20px 20px 20px 28px;
            font-size: 1.7rem;
        }

.c-btn--md.c-btn--outline-dark {
            min-width: 280px;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            padding: 19px 20px 19px 28px;
        }

.c-btn--md.c-btn--outline-dark .c-btn__icon {
                width: 28px;
                height: 28px;
            }

/* サイズ: sm（お知らせ詳細） */

.c-btn--sm.c-btn--primary {
            padding: 16px 20px 16px 28px;
            font-size: 1.5rem;
        }

.c-btn--sm.c-btn--primary .c-btn__icon {
                width: 24px;
                height: 24px;
            }

.c-btn--sm.c-btn--outline-green {
            gap: 0;
            padding: 16px 24px;
            border-radius: var(--radius-btn);
        }

.c-btn--sm.c-btn--green {
            font-size: 1.4rem;
        }

/* ===================================================================
  CSS information
  file name  :  c-pdf.css
  PDF リンク（ico_pdf.svg 20×24 + テキスト）
=================================================================== */

.c-pdf {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 10px;
    padding: 12px 22px 12px 16px;
    font-size: 1.4rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--color-primary);
    background: var(--color-lightest);
    border: 1px solid var(--color-accent);
    border-radius: var(--radius-btn-sm);
    -webkit-transition: var(--trans-hover);
    transition: var(--trans-hover);
}

.c-pdf:hover {
        color: var(--color-primary);
        background: var(--color-pale-01);
    }

.c-pdf__icon {
        width: 20px;
        height: 24px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

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

.c-pdf__icon {
            width: 18px;
            height: 21px
    }
        }

.c-pdf--on-dark {
        color: var(--color-lightest);
        background: transparent;
        border-color: var(--color-white-a80);
    }

.c-pdf--on-dark .c-pdf__icon {
            -webkit-filter: brightness(0) invert(1);
                    filter: brightness(0) invert(1);
        }

.c-pdf--on-dark:hover {
            color: var(--color-lightest);
            background: var(--color-white-a12);
        }

.c-pdf--badge {
        gap: 10px;
        padding: 11px 18px;
        line-height: normal;
    }

.c-pdf__badge {
        padding: 1px 5px;
        font-size: 1.1rem;
        border: 1px solid var(--color-accent);
        border-radius: 2px;
    }

/* ===================================================================
  CSS information
  file name  :  c-card.css
  汎用カード（product / segment / problem / flat）
=================================================================== */

.c-card {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    overflow: hidden;
    background: var(--color-lightest);
    border-radius: var(--radius-card);
    -webkit-box-shadow: var(--shadow-card);
            box-shadow: var(--shadow-card);
}

.c-card__media {
        position: relative;
        overflow: hidden;
    }

.c-card__media img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--card-pos, center);
               object-position: var(--card-pos, center);
        }

/* 写真の横並び（トップ BUSINESS 畜産・農業資材。枚数分の均等列） */

.c-card__media--pair {
            display: grid;
            grid-auto-columns: minmax(0, 1fr);
            grid-auto-flow: column;
            gap: 4px;
        }

.c-card__body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        padding: 24px 26px 28px;
    }

.c-card__tag {
        display: inline-block;
        -ms-flex-item-align: start;
            align-self: flex-start;
        padding: 4px 12px;
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.5;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
    }

.c-card__kicker {
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-red);
    }

.c-card__title {
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.5;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-card__text {
        margin-top: 10px;
        font-size: 1.4rem;
        line-height: 1.9;
        color: var(--color-text);
    }

.c-card__note {
        margin-top: 8px;
        font-size: 1.4rem;
        line-height: 1.8;
        color: var(--color-text-sub);
    }

.c-card__btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: auto;
        padding-top: 18px;
    }

/* 枠線のみの軽いカード */

.c-card--flat {
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card-weak);
                box-shadow: var(--shadow-card-weak);
    }

/* 製品カード（トップ PRODUCTS。SP は専用値） */

.c-card--product {
        gap: 14px;
        padding: 24px;
        overflow: visible;
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card-weak);
                box-shadow: var(--shadow-card-weak);
    }

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

.c-card--product {
            gap: 10px;
            padding: 16px
    }
        }

.c-card--product .c-card__media {
            height: 240px;
            background: var(--color-lightest);
            border-radius: var(--radius-image);
        }

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

.c-card--product .c-card__media {
                height: 190px
        }
            }

.c-card--product .c-card__media img {
                -o-object-fit: contain;
                   object-fit: contain;
            }

.c-card--product .c-card__media--zoom img {
            position: absolute;
            top: -2%;
            left: -4%;
            width: 108%;
            max-width: none;
            height: 108%;
            -o-object-position: center top;
               object-position: center top;
        }

.c-card--product .c-card__tag {
            position: absolute;
            top: 12px;
            left: 12px;
            z-index: 1;
            padding: 6px 20px;
            font-size: 1.3rem;
            line-height: normal;
        }

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

.c-card--product .c-card__tag {
                top: 10px;
                left: 10px;
                padding: 4px 14px;
                font-size: 1.2rem
        }
            }

.c-card--product .c-card__body {
            gap: 14px;
            padding: 0;
        }

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

.c-card--product .c-card__body {
                gap: 10px
        }
            }

.c-card--product .c-card__title {
            font-size: 2.2rem;
            line-height: 1.6;
            word-break: normal;
        }

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

.c-card--product .c-card__title {
                font-size: 2rem;
                line-height: normal
        }
            }

.c-card--product .c-card__text {
            margin-top: 0;
            font-size: 1.5rem;
            letter-spacing: .04em;
            color: var(--color-primary);
        }

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

.c-card--product .c-card__text {
                font-size: 1.3rem;
                line-height: 1.8;
                letter-spacing: 0
        }
            }

.c-card--product .c-card__note {
            margin-top: 0;
            line-height: 1.7;
            color: var(--color-text);
        }

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

.c-card--product .c-card__note {
                font-size: 1.2rem;
                line-height: normal
        }
            }

.c-card--product .c-card__btn {
            padding-top: 0;
        }

/* M2（SP のみ）: 箱の写真 + 「5kg以上はバッグインボックス」 */

.c-card--product .c-card__box {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 10px;
        }

.c-card--product .c-card__box-media {
            width: 72px;
            height: 72px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            overflow: hidden;
            border-radius: var(--radius-image);
        }

.c-card--product .c-card__box-media img {
                width: 100%;
                height: 100%;
                -o-object-fit: contain;
                   object-fit: contain;
            }

.c-card--product .c-card__box-text {
            font-size: 1.2rem;
            line-height: 1.7;
            color: var(--color-text-sub);
        }

/* 事業カード（トップ BUSINESS。SP は専用値） */

.c-card--segment {
        gap: 12px;
        padding: 24px;
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card-weak);
                box-shadow: var(--shadow-card-weak);
    }

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

.c-card--segment {
            gap: 10px;
            padding: 16px
    }
        }

.c-card--segment .c-card__media {
            height: 200px;
            border-radius: var(--radius-image);
        }

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

.c-card--segment .c-card__media {
                height: 170px
        }
            }

.c-card--segment .c-card__body {
            gap: 12px;
            padding: 0;
        }

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

.c-card--segment .c-card__body {
                gap: 10px
        }
            }

.c-card--segment .c-card__title {
            line-height: 1.6;
            word-break: normal;
        }

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

.c-card--segment .c-card__title {
                font-size: 1.9rem
        }
            }

.c-card--segment .c-card__text {
            margin-top: 0;
            letter-spacing: .04em;
        }

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

.c-card--segment .c-card__text {
                font-size: 1.3rem;
                line-height: 1.8;
                letter-spacing: 0
        }
            }

.c-card--segment .c-card__btn {
            padding-top: 0;
        }

/* お悩みカード（アイコン + 太字テキスト）。SP もデザインは PC と同値（腸菌力シリーズ SP は page CSS） */

.c-card--problem {
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 18px;
        padding: 32px 24px 28px;
        text-align: center;
        -webkit-box-shadow: var(--shadow-card-mid);
                box-shadow: var(--shadow-card-mid);
    }

.c-card--problem .c-card__icon {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 150px;
            height: 150px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-card--problem .c-card__icon img {
                width: 100%;
                height: 100%;
                -o-object-fit: contain;
                   object-fit: contain;
            }

.c-card--problem .c-card__text {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            margin-top: 0;
            font-size: 1.8rem;
            font-weight: 700;
            line-height: 1.7;
            letter-spacing: .04em;
            color: var(--color-text);
            word-break: auto-phrase;
        }

.c-card--problem .c-card__rule {
            display: block;
            width: 40px;
            height: 3px;
            border-radius: 2px;
            background: var(--color-accent);
        }

/* お悩みカード（MC）: 200px グリッドに収まる詰め・アイコン 144px */

.c-card--problem-sm {
        gap: 16px;
        padding: 28px 20px 24px;
    }

.c-card--problem-sm .c-card__icon {
            width: 144px;
            height: 144px;
        }

.c-card--problem-sm .c-card__text {
            font-size: 1.6rem;
            letter-spacing: .02em;
        }

/* ===================================================================
  CSS information
  file name  :  c-numcard.css
  番号付きカード: --step（gut SOLUTION）/ --point（MC/M2 SOLUTION）/ --badge（MC 効果）/ --pill（MC barriers）
=================================================================== */

.c-numcard {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 14px;
    padding: 36px 30px 32px;
    background: var(--color-lightest);
    border: 1px solid var(--color-border-01);
    border-radius: var(--radius-card);
    -webkit-box-shadow: var(--shadow-card);
            box-shadow: var(--shadow-card);
}

.c-numcard__no {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 44px;
        height: 44px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        padding-top: 1px; /* 数字の字面を円の中央へ（実測で .5px 上寄り。flex 中央揃えでは padding の半分だけ動く） */
        font-family: var(--font-family-en);
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: 50%;
    }

.c-numcard__tag {
        font-size: 1.3rem;
        font-weight: 700;
        letter-spacing: .12em;
        color: var(--color-accent);
    }

.c-numcard__title {
        font-size: 2.1rem;
        font-weight: 700;
        line-height: 1.5;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-numcard__text {
        font-size: 1.5rem;
        line-height: 1.9;
        color: var(--color-text);
    }

/* POINT 01 + 36×2 赤ルール + 右アイコン 150px */

.c-numcard--point {
        gap: 0;
        padding: 32px 32px 36px;
        border: 0;
    }

.c-numcard--point .c-numcard__head {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            gap: 16px;
        }

/* アイコン 150px を保ったまま見出しを折り返す */

.c-numcard--point .c-numcard__head-text {
            min-width: 0;
        }

.c-numcard--point .c-numcard__point {
            font-family: var(--font-family-en);
            font-size: 1.3rem;
            font-weight: 700;
            letter-spacing: .1em;
            color: var(--color-red);
        }

.c-numcard--point .c-numcard__point::after {
                content: "";
                display: block;
                width: 36px;
                height: 2px;
                margin-top: 8px;
                background: var(--color-red);
            }

/* 列幅が狭く文節単位では 1 行増えるため、デザインの描画どおり文字単位で折り返す */

.c-numcard--point .c-numcard__title {
            margin-top: 16px;
            font-size: 2.3rem;
            word-break: normal;
        }

/* 長いタイトル（M2 POINT 3）: SP の狭い見出し列で単語が途中で折れないよう少し小さく */

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

.c-numcard--point .c-numcard__title--sm {
                font-size: 2rem
        }
            }

.c-numcard--point .c-numcard__icon {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 150px;
            height: 150px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

/* デザインは object-fit 指定なし（fill） */

.c-numcard--point .c-numcard__icon img {
                width: 100%;
                height: 100%;
            }

.c-numcard--point .c-numcard__text {
            margin-top: 20px;
            letter-spacing: .04em;
        }

/* 縦積み（MC）: アイコン 190px（上下 -12px で詰める）→ POINT → 見出し 21px */

.c-numcard--point-stack {
        padding: 20px 28px 36px;
    }

.c-numcard--point-stack .c-numcard__head {
            -webkit-box-orient: vertical;
            -webkit-box-direction: reverse;
                -ms-flex-direction: column-reverse;
                    flex-direction: column-reverse;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
            gap: 4px;
        }

.c-numcard--point-stack .c-numcard__icon {
            -ms-flex-item-align: center;
                align-self: center;
            width: 190px;
            height: 190px;
            margin: -12px 0;
        }

.c-numcard--point-stack .c-numcard__title {
            font-size: 2.1rem;
            line-height: 1.5;
            word-break: auto-phrase;
        }

/* M2 の SOLUTION はタイトルとアイコンを上下中央揃え */
.c-page-chokinriki-m2 .c-numcard--point .c-numcard__head {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

/* STEP: 番号丸とタグを横並び、タイトル・本文は全幅（腸菌力シリーズ。SP は専用値） */
.c-numcard--step {
    -ms-flex-line-pack: start;
        align-content: start;
}
@media only screen and (max-width: 767px) {
.c-numcard--step {
        padding: 22px 20px
}
        .c-numcard--step .c-numcard__no {
            width: 38px;
            height: 38px;
            font-size: 1.5rem;
        }
        .c-numcard--step .c-numcard__tag {
            font-size: 1.2rem;
        }
        .c-numcard--step .c-numcard__title {
            font-size: 1.8rem;
        }
        .c-numcard--step .c-numcard__text {
            font-size: 1.3rem;
        }
    }
.c-numcard--step{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-column-gap: 14px;
       -moz-column-gap: 14px;
            column-gap: 14px;
    row-gap: 0;
}
.c-numcard--step .c-numcard__no {
        grid-column: 1;
    }
.c-numcard--step .c-numcard__tag {
        grid-column: 2;
    }
.c-numcard--step .c-numcard__title {
        grid-column: 1 / -1;
        margin-top: 18px;
    }
@media only screen and (max-width: 767px) {
.c-numcard--step .c-numcard__title {
            margin-top: 14px
    }
        }
.c-numcard--step .c-numcard__text {
        grid-column: 1 / -1;
        margin-top: 12px;
    }
@media only screen and (max-width: 767px) {
.c-numcard--step .c-numcard__text {
            margin-top: 10px
    }
        }
/* ===================================================================
  CSS information
  file name  :  c-kv.css
  キー / 値 テーブル（製品仕様・給与量・会社概要・仕入先・マルニゼオライト製品詳細）
  SP は 1 列積み。余白・文字サイズはデザインが PC と同値
=================================================================== */

.c-kv {
    --kv-k: minmax(150px, 230px);
    overflow: hidden;
    background: var(--color-white-a97);
    border-radius: var(--radius-card-lg);
    -webkit-box-shadow: var(--shadow-card);
            box-shadow: var(--shadow-card);
}

.c-kv--k150-200 {
        --kv-k: minmax(150px, 200px);
    }

.c-kv--k130-200 {
        --kv-k: minmax(130px, 200px);
    }

.c-kv--k110-170 {
        --kv-k: minmax(110px, 170px);
    }

.c-kv--k120-180 {
        --kv-k: minmax(120px, 180px);
    }

.c-kv--k100-130 {
        --kv-k: minmax(100px, 130px);
    }

.c-kv--plain {
        background: var(--color-lightest);
        border-radius: var(--radius-card);
    }

.c-kv__band {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 12px;
        padding: 16px 24px;
        font-size: 1.9rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--gradient-green-band);
    }

.c-kv__band img {
            width: 24px;
            height: 30px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -webkit-filter: brightness(0) invert(1);
                    filter: brightness(0) invert(1);
        }

.c-kv__band--solid {
            background: var(--color-primary);
            font-size: 1.7rem;
        }

.c-kv__row {
        display: grid;
        grid-template-columns: var(--kv-k) minmax(0, 1fr);
        font-size: 1.5rem;
        line-height: 1.8;
        border-bottom: 1px solid var(--color-border-01);
    }

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

.c-kv__row {
            grid-template-columns: minmax(0, 1fr)
    }
        }

.c-kv__k {
        padding: 16px 24px;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-pale-01);
    }

.c-kv__v {
        padding: 16px 24px;
    }

/* 製品仕様（アイコン付き） */

.c-kv--spec .c-kv__row {
            line-height: 1.9;
        }

.c-kv--spec .c-kv__k {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 14px;
            padding: 18px 24px;
        }

.c-kv--spec .c-kv__k img {
                width: 30px;
                height: 30px;
                -webkit-box-flex: 0;
                    -ms-flex: none;
                        flex: none;
            }

.c-kv--spec .c-kv__v {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            padding: 18px 26px;
            letter-spacing: .02em;
        }

/* 給与量表 */

.c-kv--dose {
        border-radius: var(--radius-card);
    }

.c-kv--dose .c-kv__k {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 12px;
            padding: 14px 20px;
        }

.c-kv--dose .c-kv__k img {
                width: 44px;
                height: 32px;
                -webkit-box-flex: 0;
                    -ms-flex: none;
                        flex: none;
                -o-object-fit: contain;
                   object-fit: contain;
            }

.c-kv--dose .c-kv__v {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            padding: 14px 20px;
        }

/* マルニゼオライト製品詳細 */

.c-kv--catalog .c-kv__k,
        .c-kv--catalog .c-kv__v {
            padding: 14px 20px;
        }

/* 小さめ（会社: 仕入先・取引先） */

.c-kv--sm .c-kv__row {
            font-size: 1.4rem;
        }

.c-kv--sm .c-kv__k,
        .c-kv--sm .c-kv__v {
            padding: 14px 18px;
        }

/* ===================================================================
  CSS information
  file name  :  c-stat.css
  数値カード: --lab（比較試験）/ --pig（抗生物質代替）/ --farm（F農場 行）
=================================================================== */

.c-stat {
    position: relative;
    background: var(--color-white-a94);
    border-radius: var(--radius-card);
}

.c-stat__icon {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-stat__icon img {
            width: 100%;
            height: 100%;
            -o-object-fit: contain;
               object-fit: contain;
        }

/* 比較試験 6 カード（SP は上段ブロックを中央寄せ） */

.c-stat--lab {
        padding: 22px 22px 20px;
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-stat--lab .c-stat__head {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 14px;
        }

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

.c-stat--lab .c-stat__head {
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center
        }
            }

.c-stat--lab .c-stat__icon {
            width: 84px;
            height: 84px;
        }

.c-stat--lab .c-stat__body {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            min-width: 0;
            text-align: left;
        }

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

.c-stat--lab .c-stat__body {
                -webkit-box-flex: 0;
                    -ms-flex: 0 1 auto;
                        flex: 0 1 auto
        }
            }

.c-stat--lab .c-stat__k {
            font-size: 1.4rem;
            font-weight: 700;
            line-height: 1.5;
            color: var(--color-primary);
            word-break: auto-phrase;
        }

.c-stat--lab .c-stat__vals {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: baseline;
                -ms-flex-align: baseline;
                    align-items: baseline;
            gap: 10px;
            margin-top: 8px;
        }

.c-stat--lab .c-stat__from {
            font-family: var(--font-family-en);
            font-size: 1.7rem;
            color: var(--color-text-weak);
        }

.c-stat--lab .c-stat__arrow {
            font-size: 1.4rem;
            color: var(--color-text-sub);
        }

.c-stat--lab .c-stat__to {
            font-family: var(--font-family-en);
            font-size: 3rem;
            font-weight: 700;
            line-height: 1;
            color: var(--color-text);
        }

.c-stat--lab .c-stat__pct {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            gap: 12px;
            margin-top: 14px;
            padding-top: 14px;
            border-top: 1px solid var(--color-border-01);
        }

.c-stat--lab .c-stat__pct img {
                width: 40px;
                height: 40px;
            }

.c-stat--lab .c-stat__pctnum {
            font-family: var(--font-family-en);
            font-size: 3rem;
            font-style: italic;
            font-weight: 700;
            line-height: 1;
            color: var(--color-red);
        }

.c-stat--lab .c-stat__unit {
            margin-left: 2px;
            font-size: 1.5rem;
        }

.c-stat--lab .c-stat__up {
            margin-left: 4px;
            font-size: 1.4rem;
        }

/* 抗生物質代替 6 カード */

.c-stat--pig {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 22px 20px;
        overflow: hidden;
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-stat--pig .c-stat__bg-arrow {
            position: absolute;
            right: 14px;
            bottom: 12px;
            height: 60px;
            width: 56px;
            -o-object-fit: contain;
               object-fit: contain;
            -o-object-position: right bottom;
               object-position: right bottom;
        }

.c-stat--pig .c-stat__bg-arrow--up {
                width: 96px;
            }

.c-stat--pig .c-stat__icon {
            position: relative;
            width: 76px;
            height: 76px;
        }

.c-stat--pig .c-stat__body {
            position: relative;
            min-width: 0;
        }

.c-stat--pig .c-stat__n {
            font-family: var(--font-family-en);
            font-size: clamp(22px, 2vw, 28px);
            font-weight: 700;
            line-height: 1.15;
            color: var(--color-primary);
            white-space: nowrap;
        }

.c-stat--pig .c-stat__k {
            margin-top: 6px;
            font-size: 1.4rem;
            line-height: 1.6;
        }

/* F農場 行（SP は 1 列・中央揃え、備考の左線なし） */

.c-stat--farm {
        display: grid;
        grid-template-columns: minmax(220px, 1.1fr) minmax(200px, 1fr) minmax(200px, 1.2fr);
        font-size: 1.5rem;
        line-height: 1.8;
        background: none;
        border-radius: 0;
        border-bottom: 1px solid var(--color-border-01);
    }

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

.c-stat--farm {
            grid-template-columns: minmax(0, 1fr)
    }
        }

.c-stat--farm .c-stat__k {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 14px;
            padding: 14px 24px;
            font-size: 1.6rem;
            font-weight: 700;
            color: var(--color-primary);
            background: var(--color-pale-01);
        }

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

.c-stat--farm .c-stat__k {
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center
        }
            }

.c-stat--farm .c-stat__icon {
            width: 52px;
            height: 52px;
        }

.c-stat--farm .c-stat__vals {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -ms-flex-wrap: wrap;
                flex-wrap: wrap;
            -webkit-box-align: baseline;
                -ms-flex-align: baseline;
                    align-items: baseline;
            gap: 10px;
            padding: 14px 24px;
            font-family: var(--font-family-en);
            font-weight: 700;
        }

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

.c-stat--farm .c-stat__vals {
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center
        }
            }

.c-stat--farm .c-stat__from {
            font-size: 1.7rem;
            color: var(--color-text);
        }

.c-stat--farm .c-stat__arrow {
            font-size: 1.5rem;
            color: var(--color-primary);
        }

.c-stat--farm .c-stat__to {
            font-size: 3.2rem;
            line-height: 1.2;
            color: var(--color-red);
        }

.c-stat--farm .c-stat__unit {
            margin-left: 2px;
            font-size: 1.5rem;
        }

.c-stat--farm .c-stat__note {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            padding: 14px 24px;
            border-left: 1px solid var(--color-border-01);
        }

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

.c-stat--farm .c-stat__note {
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                padding: 0 24px 14px;
                border-left: 0
        }
            }

.c-stat-table {
    margin-top: 40px;
    overflow: hidden;
    background: var(--color-white-a96);
    border-radius: var(--radius-card);
    -webkit-box-shadow: var(--shadow-card);
            box-shadow: var(--shadow-card);
}

/* ===================================================================
  CSS information
  file name  :  c-cta.css
  共通 CTA（上辺アーチ mask + bg_cta + 緑オーバーレイ + MC/M2 丸）
  --sample   : サンプル請求（MC / M2 / お客様の声 / 腸菌力シリーズ PC / トップ PC）
  --estimate : 見積依頼（事業・製品 / 畜産 / 石灰 / 会社案内）
  --compact-sp : トップ・腸菌力シリーズの SP 専用レイアウト
=================================================================== */

.c-cta {
    position: relative;
    margin-top: -96px;
    padding: 184px var(--padding-side) 96px;
    overflow: hidden;
    color: var(--color-lightest);
    text-align: center;
    background: var(--color-primary);
    -webkit-mask-image: radial-gradient(56% 96px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%);
    mask-image: radial-gradient(56% 96px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%);
}

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

.c-cta {
        padding: 140px var(--padding-side) 58px
}
    }

.c-cta--arch-48 {
        margin-top: -48px;
        padding: 92px var(--padding-side) 48px;
        -webkit-mask-image: radial-gradient(56% 48px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%);
        mask-image: radial-gradient(56% 48px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%);
    }

.c-cta--estimate {
        padding-top: 168px;
        padding-bottom: 80px;
    }

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

.c-cta--estimate {
            padding-top: 140px;
            padding-bottom: 48px
    }
        }

.c-cta__bg {
        position: absolute;
        inset: 0;
    }

.c-cta__bg img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: center 70%;
               object-position: center 70%;
        }

.c-cta__overlay {
        position: absolute;
        inset: 0;
        background: var(--gradient-cta);
    }

/* PC 左右の商品丸 */

.c-cta__circle {
        position: absolute;
        top: 50%;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 340px;
        height: 340px;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: 50%;
        -webkit-transform: translateY(-50%);
                transform: translateY(-50%);
    }

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

.c-cta__circle {
            display: none
    }
        }

.c-cta__circle img {
            width: 100%;
            height: 100%;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-cta__circle--mc {
            left: -70px;
        }

.c-cta__circle--mc img {
                -webkit-transform: scale(.92);
                        transform: scale(.92);
            }

.c-cta__circle--m2 {
            right: -70px;
        }

.c-cta--wide .c-cta__circle {
        top: 42%;
    }

.c-cta--wide .c-cta__circle--mc {
            left: calc(50% - 720px);
        }

.c-cta--wide .c-cta__circle--m2 {
            right: calc(50% - 720px);
        }

/* SP 中央横並びの商品丸（全バリアント） */

.c-cta__circles-sp {
        display: none;
    }

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

.c-cta__circles-sp {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            gap: 18px;
            margin-bottom: 28px
    }
        }

.c-cta__circle-sm {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 140px;
        height: 140px;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: 50%;
        -webkit-box-shadow: var(--shadow-circle);
                box-shadow: var(--shadow-circle);
    }

.c-cta__circle-sm img {
            width: 100%;
            height: 100%;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-cta__circle-sm--mc img {
            -webkit-transform: scale(.92);
                    transform: scale(.92);
        }

.c-cta__inner {
        position: relative;
        max-width: var(--width-cta);
        margin: 0 auto;
    }

.c-cta__tag {
        display: inline-block;
        padding: 7px 24px;
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .18em;
        color: var(--color-lightest);
        border: 1px solid var(--color-white-a70);
        border-radius: var(--radius-pill);
    }

.c-cta__title {
        margin-top: 22px;
        font-size: var(--font-size-cta-h2);
        font-weight: 900;
        line-height: 1.5;
        letter-spacing: .04em;
        color: var(--color-lightest);
        white-space: nowrap;
    }

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

.c-cta__title {
            white-space: normal
    }
        }

.c-cta__lead {
        margin-top: 16px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .02em;
        white-space: nowrap;
    }

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

.c-cta__lead {
            font-size: 1.4rem;
            text-align: left;
            white-space: normal
    }
        }

.c-cta__kg {
        font-family: var(--font-family-en);
        font-size: 2.2rem;
        font-weight: 700;
        color: var(--color-yellow-01);
    }

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

.c-cta__kg {
            font-size: 1.8rem
    }
        }

.c-cta__note {
        margin-top: 6px;
        font-size: 1.3rem;
        line-height: 1.7;
        white-space: nowrap;
    }

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

.c-cta__note {
            text-align: left;
            white-space: normal
    }
        }

.c-cta__btns {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
        gap: 20px;
        margin-top: 32px;
    }

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

.c-cta__btns {
            grid-template-columns: minmax(0, 1fr);
            gap: 10px
    }
        }

.c-cta__btns .c-btn {
            width: 100%;
        }

/* ボタン 1 つ（会社案内）: PC は 340px で中央 */

@media only screen and (min-width: 768px) {

.c-cta__btns:has(> .c-btn:only-child) {
                max-width: 340px;
                margin-inline: auto
        }
            }

/* 「お問い合わせ」（サンプル CTA の 3 つ目）: PC は内容幅で中央、SP は全幅 */

.c-cta__btn-wide {
        grid-column: 1 / -1;
        justify-self: center;
    }

@media only screen and (min-width: 768px) {

.c-cta__btn-wide {
            width: auto !important
    }
        }

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

.c-cta__btn-wide {
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between
    }
        }

.c-cta__tel {
        margin-top: 32px;
    }

.c-cta__tel .c-tel {
            line-height: normal;
        }

.c-cta__hours {
        max-width: 360px;
        margin: 6px auto 0;
        font-size: 1.3rem;
        line-height: 1.7;
    }

/* ---------- 見積依頼 ---------- */

.c-cta.c-cta--estimate .c-cta__title {
            margin-top: 18px;
            font-size: var(--font-size-cta-h2-sm);
            white-space: normal;
            word-break: auto-phrase;
        }

.c-cta.c-cta--estimate .c-cta__lead {
            max-width: 460px;
            margin: 12px auto 0;
            letter-spacing: 0;
            white-space: normal;
        }

.c-cta.c-cta--estimate .c-cta__btns {
            grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
            margin-top: 28px;
        }

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

.c-cta.c-cta--estimate .c-cta__btns {
                grid-template-columns: minmax(0, 1fr)
        }
            }

.c-cta.c-cta--estimate .c-btn--primary {
            font-size: 1.7rem;
        }

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

.c-cta.c-cta--estimate .c-btn--primary {
                padding: 18px 18px 18px 22px;
                font-size: 1.6rem
        }
            }

.c-cta.c-cta--estimate .c-btn--outline-dark {
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
            padding: 21px 20px 21px 28px;
            font-size: 1.7rem;
        }

.c-cta.c-cta--estimate .c-btn--outline-dark .c-btn__icon {
                width: 28px;
                height: 28px;
            }

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

.c-cta.c-cta--estimate .c-btn--outline-dark {
                padding: 16px 17px 16px 21px;
                font-size: 1.5rem
        }
            }

.c-cta.c-cta--estimate .c-cta__tel {
            margin-top: 26px;
        }

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

.c-cta.c-cta--estimate .c-cta__tel {
                margin-top: 28px
        }
            }

.c-cta.c-cta--estimate .c-cta__hours {
            max-width: none;
        }

/* ---------- トップ・腸菌力シリーズ SP ---------- */

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

.c-cta.c-cta--compact-sp {
            margin-top: -48px;
            padding: 64px var(--padding-side) 56px;
            -webkit-mask-image: radial-gradient(70% 48px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%);
            mask-image: radial-gradient(70% 48px at 50% 0, transparent 0, transparent calc(100% - 1px), #000 100%)
    }
            .c-cta.c-cta--compact-sp .c-cta__tag {
                padding: 6px 20px;
            }
            .c-cta.c-cta--compact-sp .c-cta__title {
                margin-top: 16px;
                letter-spacing: .02em;
                word-break: auto-phrase;
            }
            .c-cta.c-cta--compact-sp .c-cta__lead {
                margin-top: 12px;
                line-height: 1.8;
                letter-spacing: 0;
                text-align: center;
            }
            .c-cta.c-cta--compact-sp .c-cta__note {
                margin-top: 4px;
                font-size: 1.2rem;
                text-align: center;
            }
            .c-cta.c-cta--compact-sp .c-cta__btns {
                margin-top: 24px;
            }
                .c-cta.c-cta--compact-sp .c-cta__btns .c-btn {
                    gap: 12px;
                }
                .c-cta.c-cta--compact-sp .c-cta__btns .c-btn__icon {
                    width: 24px;
                    height: 24px;
                }
            .c-cta.c-cta--compact-sp .c-btn--primary {
                padding: 18px 18px 18px 22px;
                font-size: 1.6rem;
            }
            .c-cta.c-cta--compact-sp .c-btn--outline-dark {
                padding: 16px 17px 16px 21px;
                font-size: 1.5rem;
            }
                .c-cta.c-cta--compact-sp .c-btn--outline-dark .c-btn__icon {
                    width: 26px;
                    height: 26px;
                }
            .c-cta.c-cta--compact-sp .c-cta__tel {
                margin-top: 28px;
            }
            .c-cta.c-cta--compact-sp .c-cta__hours {
                max-width: none;
                font-size: 1.2rem;
                line-height: normal;
            }
        }

/* ===================================================================
  CSS information
  file name  :  c-leaf.css
  リーフ装飾（セクション角に絶対配置）
  幅・オフセットは --leaf-w / --leaf-x / --leaf-y（SP 専用値は *-sp）を nnsg_leaf() が style 属性で渡す
=================================================================== */

/* リーフ装飾を持つセクションは、装飾が隣接セクションへはみ出さないよう切り抜く */

.c-section:has(> .c-leaf) {
    overflow: hidden;
}

.c-leaf {
    /* 切り抜かれる辺（セクション端）から --leaf-fade の範囲を透明 → 不透明にフェードし、直線の切れ目を見せない
       --_edge: 画像の上端（tl / tr）または下端（bl / br）からセクション端までの距離 */
    --leaf-fade: 72px;
    --_edge: max(0px, calc(var(--_y) * -1));
    position: absolute;
    z-index: 0;
    width: var(--leaf-w-sp, var(--leaf-w));
    height: auto;
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;
    -webkit-mask-image: linear-gradient(var(--_dir), transparent var(--_edge), #000 calc(var(--_edge) + var(--leaf-fade)));
    mask-image: linear-gradient(var(--_dir), transparent var(--_edge), #000 calc(var(--_edge) + var(--leaf-fade)));
}

@media only screen and (min-width: 768px) {

.c-leaf {
        width: var(--leaf-w)
}
    }

.c-leaf--sm {
        --leaf-w: min(220px, 40%);
    }

.c-leaf--md {
        --leaf-w: min(340px, 42%);
    }

.c-leaf--lg {
        --leaf-w: min(400px, 44%);
    }

.c-leaf--tl,
    .c-leaf--tr {
        --_dir: 180deg;
        top: var(--_y);
    }

.c-leaf--bl,
    .c-leaf--br {
        --_dir: 0deg;
        bottom: var(--_y);
    }

.c-leaf--tl {
        --_y: var(--leaf-y-sp, var(--leaf-y, -40px));
        left: var(--leaf-x-sp, var(--leaf-x, -60px));
    }

@media only screen and (min-width: 768px) {

.c-leaf--tl {
            --_y: var(--leaf-y, -40px);
            left: var(--leaf-x, -60px)
    }
        }

.c-leaf--tr {
        --_y: var(--leaf-y-sp, var(--leaf-y, -30px));
        right: var(--leaf-x-sp, var(--leaf-x, -50px));
    }

@media only screen and (min-width: 768px) {

.c-leaf--tr {
            --_y: var(--leaf-y, -30px);
            right: var(--leaf-x, -50px)
    }
        }

.c-leaf--bl {
        --_y: var(--leaf-y-sp, var(--leaf-y, -60px));
        left: var(--leaf-x-sp, var(--leaf-x, -40px));
    }

@media only screen and (min-width: 768px) {

.c-leaf--bl {
            --_y: var(--leaf-y, -60px);
            left: var(--leaf-x, -40px)
    }
        }

.c-leaf--br {
        --_y: var(--leaf-y-sp, var(--leaf-y, -60px));
        right: var(--leaf-x-sp, var(--leaf-x, -40px));
    }

@media only screen and (min-width: 768px) {

.c-leaf--br {
            --_y: var(--leaf-y, -60px);
            right: var(--leaf-x, -40px)
    }
        }

.c-leaf--o45 {
        opacity: .45;
    }

.c-leaf--o50 {
        opacity: .5;
    }

.c-leaf--o60 {
        opacity: .6;
    }

.c-leaf--o80 {
        opacity: .8;
    }

.c-leaf--o100 {
        opacity: 1;
    }

.c-leaf--flip {
        -webkit-transform: scaleX(-1);
                transform: scaleX(-1);
    }

/* ===================================================================
  CSS information
  file name  :  c-voice.css
  お客様の声（セクション / 一覧 / ほかの声）
  基本値は製品ページ（SP もデザインは PC と同値）。トップ・腸菌力シリーズは下部で上書き
=================================================================== */

.c-voice__bg {
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
    }

.c-voice__bg img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: center bottom;
               object-position: center bottom;
            -webkit-mask-image: radial-gradient(circle at 0 0, transparent 0, transparent 30%, #000 32%);
            mask-image: radial-gradient(circle at 0 0, transparent 0, transparent 30%, #000 32%);
        }

.c-voice__grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr));
        gap: 32px;
        margin-top: 44px;
    }

.c-voice__grid--gap-sm {
            gap: 28px;
        }

.c-voice__grid--archive {
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
            margin-top: 0;
        }

.c-voice__card {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        overflow: hidden;
        color: inherit;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-voice__card:hover {
            color: inherit;
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

.c-voice__media {
        height: 250px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-voice__media img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: 50% 40%;
               object-position: 50% 40%;
        }

.c-voice__card:first-child .c-voice__media img,
    .c-voice__card--others .c-voice__media img {
        -o-object-position: 50% 45%;
           object-position: 50% 45%;
    }

/* 一覧・トップは投稿ごとの表示位置（ACF voice_thumb_pos → --thumb-pos） */

.c-voice__card--archive .c-voice__media img {
        -o-object-position: var(--thumb-pos, 50% 35%);
           object-position: var(--thumb-pos, 50% 35%);
    }

.c-voice__card--archive .c-voice__media {
        height: 200px;
    }

.c-voice__card--others .c-voice__media {
        height: 180px;
    }

.c-voice__body {
        padding: 24px 28px 30px;
    }

.c-voice__card--archive .c-voice__body {
        padding: 24px 28px 28px;
    }

.c-voice__card--others .c-voice__body {
        padding: 22px 26px 26px;
    }

.c-voice__who {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        font-size: 1.4rem;
        color: var(--color-text);
    }

.c-voice__pin {
        width: 14px;
        height: 16px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-voice__line {
        display: block;
        width: 18px;
        height: 1px;
        margin-top: 12px;
        background: var(--color-hairline);
    }

.c-voice__farm {
        font-size: 1.3rem;
        color: var(--color-text-sub);
    }

.c-voice__title {
        margin-top: 14px;
        font-size: 2.2rem;
        font-weight: 700;
        line-height: 1.6;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-voice__card--archive .c-voice__title {
        margin-top: 8px;
        font-size: 1.9rem;
        word-break: normal;
    }

.c-voice__card--others .c-voice__title {
        margin-top: 8px;
        font-size: 1.7rem;
        line-height: 1.7;
        word-break: normal;
    }

.c-voice__point {
        margin-top: 10px;
        font-size: 1.4rem;
        line-height: 1.9;
        color: var(--color-text);
    }

/* ※注記（クライアント指定で左揃え） */

.c-voice__note {
        margin-top: 24px;
        font-size: 1.3rem;
        line-height: 1.8;
        color: var(--color-text-sub);
        text-align: left;
    }

.c-voice__more {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin-top: 36px;
    }

.c-voice--others .c-voice__more {
        margin-top: 28px;
    }

.c-voice__empty {
        grid-column: 1 / -1;
        text-align: center;
        color: var(--color-text-sub);
    }

/* 背景の radial mask なし（gut-health / MC / M2） */
.c-voice--nomask .c-voice__bg img {
    -webkit-mask-image: none;
    mask-image: none;
}

/* トップ PC（注記はデザインどおり中央揃え。SP は左揃え） */
.c-page-home .c-voice .c-voice__note {
        margin-top: 20px;
        line-height: 1.7;
    }
@media only screen and (min-width: 768px) {
.c-page-home .c-voice .c-voice__note {
            text-align: center
    }
        }
.c-page-home .c-voice .c-voice__more {
        margin-top: 28px;
    }

/* 腸菌力シリーズ PC: カード群の上余白 40px */
@media only screen and (min-width: 768px) {
.c-page-gut-health .c-voice__grid {
        margin-top: 40px
}
    }

/* トップ・腸菌力シリーズ SP（専用マークアップ） */
@media only screen and (max-width: 767px) {
        .c-page-home .c-voice .c-voice__bg img, .c-page-gut-health .c-voice .c-voice__bg img {
            opacity: .9;
            -webkit-mask-image: none;
            mask-image: none;
        }
        .c-page-home .c-voice .c-voice__grid, .c-page-gut-health .c-voice .c-voice__grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 18px;
            margin-top: 28px;
        }
        .c-page-home .c-voice .c-voice__media, .c-page-gut-health .c-voice .c-voice__media {
            height: 180px;
        }
        .c-page-home .c-voice .c-voice__body, .c-page-gut-health .c-voice .c-voice__body {
            padding: 16px 18px 20px;
        }
        .c-page-home .c-voice .c-voice__who, .c-page-gut-health .c-voice .c-voice__who {
            font-size: 1.2rem;
        }
        .c-page-home .c-voice .c-voice__pin, .c-page-gut-health .c-voice .c-voice__pin {
            width: 12px;
            height: 14px;
        }
        .c-page-home .c-voice .c-voice__line, .c-page-gut-health .c-voice .c-voice__line {
            margin-top: 10px;
        }
        .c-page-home .c-voice .c-voice__title, .c-page-gut-health .c-voice .c-voice__title {
            margin-top: 10px;
            font-size: 1.7rem;
        }
        .c-page-home .c-voice .c-voice__note, .c-page-gut-health .c-voice .c-voice__note {
            margin-top: 16px;
            font-size: 1.1rem;
            line-height: 1.7;
        }
        .c-page-home .c-voice .c-voice__more, .c-page-gut-health .c-voice .c-voice__more {
            margin-top: 20px;
        }
            .c-page-home .c-voice .c-voice__more .c-btn--pill, .c-page-gut-health .c-voice .c-voice__more .c-btn--pill {
                gap: 12px;
                padding: 14px 36px;
                font-size: 1.5rem;
            }
    }

.c-page-home__voice .c-voice__card .c-voice__media img {
    -o-object-position: var(--thumb-pos, 50% 35%);
       object-position: var(--thumb-pos, 50% 35%);
}

/* ===================================================================
  CSS information
  file name  :  c-reason.css
  REASON: PC 銀縁の丸（330px ×3・64px のアイコン枠）/ SP 横並びカード（84px 銀縁丸アイコン）
  アイコンの見た目サイズは c-reason__icon--xl / --h60 / --h56（reason.php の icon_size）
=================================================================== */

.c-reason {
    text-align: center;
}

.c-reason__grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        justify-items: center;
        gap: clamp(20px, 3.5vw, 48px);
        margin-top: 32px;
    }

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

.c-reason__grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 14px;
            margin-top: 28px
    }
        }

.c-reason__item {
        width: 100%;
        max-width: 330px;
    }

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

.c-reason__item {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 16px;
            max-width: none;
            padding: 16px;
            text-align: left;
            background: var(--color-lightest);
            border-radius: var(--radius-card);
            -webkit-box-shadow: var(--shadow-card);
                    box-shadow: var(--shadow-card)
    }
        }

.c-reason__circle {
        aspect-ratio: 1;
        padding: 6px;
        background: var(--gradient-silver);
        border-radius: 50%;
    }

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

.c-reason__circle {
            display: contents
    }
        }

.c-reason__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 6px;
        width: 100%;
        height: 100%;
        padding: clamp(26px, 3.2vw, 44px) clamp(28px, 3.4vw, 46px);
        background: var(--color-lightest);
        border-radius: 50%;
    }

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

.c-reason__inner {
            display: contents
    }
        }

.c-reason__medal {
        /* PC: 64px の枠に中央配置（xl はあふれさせる） */
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 64px;
        height: 64px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

/* SP: 84px の銀縁（4px）+ 白い丸の中央にアイコン */

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

.c-reason__medal {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 84px;
            height: 84px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            background: radial-gradient(circle, var(--color-lightest) 0 38px, transparent 38.5px), var(--gradient-silver);
            border-radius: 50%
    }
        }

.c-reason__icon {
        display: block;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-reason__icon--xl {
            width: 88px;
            max-width: none;
            height: auto;
        }

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

.c-reason__icon--xl {
                width: 60px
        }
            }

.c-reason__icon--h60 {
            width: auto;
            height: 60px;
        }

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

.c-reason__icon--h60 {
                height: 40px
        }
            }

.c-reason__icon--h56 {
            width: auto;
            height: 56px;
        }

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

.c-reason__icon--h56 {
                height: 38px
        }
            }

.c-reason__text-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
    }

/* SP: デザインは番号がブロック内のインライン（本文 16px の行ボックスで高さが決まる）ため block */

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

.c-reason__text-wrap {
            display: block;
            min-width: 0
    }
        }

.c-reason__no {
        font-family: var(--font-family-en);
        font-size: 2.2rem;
        font-weight: 700;
        line-height: 1;
        color: var(--color-red);
    }

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

.c-reason__no {
            font-size: 1.5rem
    }
        }

.c-reason__title {
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.35;
        color: var(--color-primary);
    }

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

.c-reason__title {
            margin-top: 2px;
            font-size: 1.7rem
    }
        }

.c-reason__text {
        margin-top: 2px;
        font-size: 1.3rem;
        line-height: 1.7;
        color: var(--color-text);
    }

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

.c-reason__text {
            margin-top: 6px;
            font-size: 1.3rem;
            line-height: 1.7
    }
        }

/* ===================================================================
  CSS information
  file name  :  c-chart.css
  エビデンス figure（アイコン + 見出し + SVG グラフ + 本文 + 出典）
=================================================================== */

.c-chart {
    --chart-pad: 32px;
    display: grid;
    grid-template-columns: 96px minmax(200px, 1fr) minmax(120px, 220px);
    grid-template-areas: "icon body figure";
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 28px;
    padding: var(--chart-pad);
    background: var(--color-lightest);
    border-radius: var(--radius-row);
    -webkit-box-shadow: var(--shadow-card-weak);
            box-shadow: var(--shadow-card-weak);
}

/* SP: アイコン + 見出し → グラフ → 本文 → 出典 */

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

.c-chart {
        --chart-pad: 20px;
        grid-template-columns: 64px minmax(0, 1fr);
        grid-template-areas:
            "icon title"
            "figure figure"
            "text text"
            "caption caption";
        gap: 0 14px;
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card)
}
    }

.c-chart__icon {
        grid-area: icon;
        align-self: start;
        width: 96px;
        height: 96px;
    }

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

.c-chart__icon {
            -ms-flex-item-align: center;
                align-self: center;
            width: 64px;
            height: 64px
    }
        }

.c-chart__body {
        grid-area: body;
        min-width: 0;
    }

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

.c-chart__body {
            display: contents
    }
        }

.c-chart__title {
        font-size: 2.2rem;
        font-weight: 700;
        line-height: 1.6;
        color: var(--color-primary);
    }

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

.c-chart__title {
            grid-area: title;
            font-size: 1.7rem
    }
        }

.c-chart__text {
        margin-top: 14px;
        font-size: 1.4rem;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-text);
    }

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

.c-chart__text {
            grid-area: text;
            margin-top: 12px;
            font-size: 1.3rem;
            line-height: 1.8;
            letter-spacing: 0
    }
        }

.c-chart__caption {
        margin-top: 12px;
        font-size: 1.3rem;
        line-height: 1.7;
        color: var(--color-text-sub);
    }

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

.c-chart__caption {
            grid-area: caption;
            margin-top: 8px;
            font-size: 1.1rem;
            line-height: 1.6
    }
        }

.c-chart__figure {
        grid-area: figure;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 6px;
        min-width: 0;
    }

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

.c-chart__figure {
            display: block
    }
        }

.c-chart__svg {
        display: block;
        width: 100%;
        height: auto;
    }

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

.c-chart__svg {
            width: 76%;
            margin: 14px auto 0
    }
            .c-chart__svg--milk {
                width: 78%;
            }
        }

.c-chart__figcaption {
        font-size: 1.1rem;
        color: var(--color-text-sub);
        text-align: center;
    }

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

.c-chart__figcaption {
            margin-top: 4px
    }
        }

/* 単体グラフカード（腸菌力シリーズ EVIDENCE 2×2）。出典の罫線はクライアント指定でカード幅いっぱい */

.c-chart--single {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        gap: 0;
        background: var(--color-white-a96);
    }

/* 消臭効果カードのみデザインは不透明の白 */

.c-chart--single.c-chart--solid {
            background: var(--color-lightest);
        }

.c-chart--single{
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
}

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

.c-chart--single {
            --chart-pad: 20px
    }
        }

.c-chart--single .c-chart__title {
            font-size: 2rem;
            line-height: 1.6;
        }

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

.c-chart--single .c-chart__title {
                font-size: 1.7rem
        }
            }

.c-chart--single .c-chart__figure {
            display: block;
            width: 100%;
            margin: 0;
        }

.c-chart--single .c-chart__svg {
            width: 78%;
            max-width: 320px;
            margin: 16px auto 0;
        }

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

.c-chart--single .c-chart__svg {
                width: 76%;
                max-width: none;
                margin-top: 14px
        }
            }

.c-chart--single .c-chart__svg--milk {
                width: 78%;
                max-width: 330px;
            }

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

.c-chart--single .c-chart__svg--milk {
                    width: 82%;
                    max-width: none
            }
                }

.c-chart--single .c-chart__svg--weight {
                width: 80%;
                max-width: 330px;
            }

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

.c-chart--single .c-chart__svg--weight {
                    width: 80%;
                    max-width: none
            }
                }

.c-chart--single .c-chart__figcaption {
            margin-top: 0;
            font-size: 1.1rem;
            line-height: normal;
        }

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

.c-chart--single .c-chart__figcaption {
                margin-top: 4px
        }
            }

.c-chart--single .c-chart__text {
            margin-top: 20px;
            font-size: 1.5rem;
            letter-spacing: .04em;
        }

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

.c-chart--single .c-chart__text {
                margin-top: 12px;
                font-size: 1.3rem;
                line-height: 1.8;
                letter-spacing: 0
        }
            }

.c-chart--single .c-chart__caption {
            margin: 12px calc(var(--chart-pad) * -1) 0;
            padding: 12px var(--chart-pad) 0;
            border-top: 1px solid var(--color-border-01);
        }

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

.c-chart--single .c-chart__caption {
                margin-top: 10px;
                padding-top: 10px;
                font-size: 1.1rem;
                line-height: 1.6
        }
            }

.c-chart--single:has(.c-page-gut-health__odor) .c-chart__caption {
            margin-top: auto;
        }

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

.c-chart--single:has(.c-page-gut-health__odor) .c-chart__caption {
                margin-top: 10px
        }
            }

/* エビデンスのグループ見出し（M2 / MC の区分け） */
.c-chart-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    gap: 14px;
}
@media only screen and (max-width: 767px) {
.c-chart-group {
        gap: 10px;
        margin-top: 4px
}
    }
/* 2 つ目以降のグループ。デザインのスペーサー + 親の gap 分を margin で再現 */
.c-chart-group--spaced {
        margin-top: 32px;
    }
@media only screen and (max-width: 767px) {
.c-chart-group--spaced {
            margin-top: 28px
    }
        }
.c-chart-group__pill {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        padding: 6px 16px;
        font-size: 1.3rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-pill);
    }
@media only screen and (max-width: 767px) {
.c-chart-group__pill {
            padding: 4px 12px;
            font-size: 1.1rem
    }
        }
.c-chart-group__title {
        font-size: 2.2rem;
        font-weight: 900;
        line-height: 1.5;
        letter-spacing: .04em;
        color: var(--color-primary);
    }
@media only screen and (max-width: 767px) {
.c-chart-group__title {
            font-size: 1.7rem
    }
        }
.c-chart-group__line {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        height: 2px;
        background: var(--color-accent);
        opacity: .4;
    }
/* 腸菌力シリーズ */
@media only screen and (max-width: 767px) {
.c-chart-group--lg {
            margin-top: 8px
    }
        }
.c-chart-group--lg.c-chart-group--spaced {
            margin-top: 44px;
        }
@media only screen and (max-width: 767px) {
.c-chart-group--lg.c-chart-group--spaced {
                margin-top: 36px
        }
            }
.c-chart-group--lg .c-chart-group__title {
            font-size: 2.4rem;
        }
@media only screen and (max-width: 767px) {
.c-chart-group--lg .c-chart-group__title {
                font-size: 1.8rem
        }
            }
/* ===================================================================
  CSS information
  file name  :  c-table.css
  --compare（MC/M2 比較: PC 3 列表 / SP 項目カード）/ --growth（M2 増体推移: 6 列・SP 横スクロール）
=================================================================== */

.c-table--compare {
        margin-top: 40px;
        overflow: hidden;
        background: var(--color-white-a96);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-table--compare {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 14px;
            margin-top: 28px;
            overflow: visible;
            background: none;
            border-radius: 0;
            -webkit-box-shadow: none;
                    box-shadow: none
    }
        }

.c-table--compare .c-table__head {
            display: grid;
            grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) minmax(0, 1fr);
            color: var(--color-lightest);
            background: var(--color-primary);
            font-size: 1.5rem;
            font-weight: 700;
        }

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

.c-table--compare .c-table__head {
                display: none
        }
            }

.c-table--compare .c-table__head > * {
                padding: 18px 24px;
            }

.c-table--compare .c-table__head > * + * {
                    border-left: 1px solid var(--color-white-a25);
                }

.c-table--compare .c-table__row {
            display: grid;
            grid-template-columns: minmax(120px, 170px) minmax(0, 1fr) minmax(0, 1fr);
            font-size: 1.5rem;
            line-height: 1.8;
            border-top: 1px solid var(--color-border-01);
        }

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

.c-table--compare .c-table__row {
                display: block;
                overflow: hidden;
                font-size: 1.3rem;
                line-height: 1.7;
                background: var(--color-lightest);
                border: 0;
                border-radius: var(--radius-card);
                -webkit-box-shadow: var(--shadow-card);
                        box-shadow: var(--shadow-card)
        }
            }

.c-table--compare .c-table__k {
            padding: 16px 24px;
            font-weight: 700;
            color: var(--color-primary);
            background: var(--color-pale-01);
        }

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

.c-table--compare .c-table__k {
                padding: 10px 16px;
                font-size: 1.4rem;
                color: var(--color-lightest);
                background: var(--color-primary)
        }
            }

.c-table--compare .c-table__v {
            padding: 16px 24px;
            border-left: 1px solid var(--color-border-01);
        }

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

.c-table--compare .c-table__v {
                display: grid;
                grid-template-columns: 56px minmax(0, 1fr);
                padding: 0;
                border-left: 0
        }
                .c-table--compare .c-table__v + .c-table__v {
                    border-top: 1px solid var(--color-border-01);
                }
            }

.c-table--compare .c-table__v::before {
                content: attr(data-label);
                display: none;
            }

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

.c-table--compare .c-table__v::before {
                    display: block;
                    padding: 10px 12px;
                    font-family: var(--font-family-en);
                    font-weight: 700;
                    color: var(--color-primary);
                    background: var(--color-pale-01)
            }
                }

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

.c-table--compare .c-table__v > span {
                    display: block;
                    padding: 10px 14px
            }
                }

/* M2 増体推移表 */

.c-table__scroll {
        margin-top: 32px;
        overflow-x: auto;
        overflow-y: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
        -webkit-overflow-scrolling: touch;
    }

.c-table--growth {
        min-width: 0;
    }

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

.c-table--growth {
            min-width: 600px
    }
        }

.c-table--growth .c-table__head,
        .c-table--growth .c-table__row {
            display: grid;
            grid-template-columns: minmax(120px, 1.2fr) repeat(5, minmax(0, 1fr));
        }

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

.c-table--growth .c-table__head,
        .c-table--growth .c-table__row {
                grid-template-columns: 96px repeat(5, minmax(0, 1fr))
        }
            }

/* グループ見出し行（去勢・メス 合計／去勢のみ／メスのみ）。2 つ目以降は上に 2px の緑線 */

.c-table--growth .c-table__group {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 10px;
            padding: 10px 18px;
            font-size: 1.4rem;
            font-weight: 700;
            color: var(--color-primary);
            background: var(--color-table-group);
        }

.c-table--growth .c-table__group::before {
                content: "";
                display: block;
                width: 4px;
                height: 16px;
                border-radius: 2px;
                background: var(--color-primary);
            }

.c-table--growth .c-table__group ~ .c-table__group {
                border-top: 2px solid var(--color-primary);
            }

.c-table--growth .c-table__head {
            color: var(--color-lightest);
            background: var(--color-primary);
            font-size: 1.4rem;
            font-weight: 700;
        }

.c-table--growth .c-table__head > * {
                padding: 14px 10px;
                text-align: center;
            }

.c-table--growth .c-table__head > *:first-child {
                    padding-left: 18px;
                    text-align: left;
                }

.c-table--growth .c-table__head > * + * {
                    border-left: 1px solid var(--color-white-a25);
                }

.c-table--growth .c-table__row {
            font-size: 1.4rem;
            line-height: 1.8;
            border-top: 1px solid var(--color-border-01);
        }

.c-table--growth .c-table__row > * {
                padding: 13px 10px;
                font-family: var(--font-family-en);
                text-align: center;
            }

.c-table--growth .c-table__row .c-table__w {
                font-weight: 700;
            }

.c-table--growth .c-table__row .c-table__k {
                padding-left: 18px;
                padding-right: 18px;
                font-family: var(--font-family-primary);
                font-weight: 700;
                color: var(--color-primary);
                text-align: left;
                background: var(--color-pale-01);
                white-space: nowrap;
            }

.c-table--growth .c-table__row .c-table__up {
                font-weight: 700;
                color: var(--color-red);
                white-space: nowrap;
            }

.c-table__hint {
        display: none;
        margin-top: 8px;
        font-size: 1.1rem;
        color: var(--color-text-sub);
    }

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

.c-table__hint {
            display: block
    }
        }

.c-table__source {
        margin-top: 16px;
        font-size: 1.3rem;
        color: var(--color-text-sub);
        text-align: center;
    }

/* ===================================================================
  CSS information
  file name  :  c-movie.css
  動画タイル（16:9・赤い再生ボタン。URL 未設定時はプレースホルダー）
=================================================================== */

.c-movie {
    display: block;
    color: inherit;
}

.c-movie:hover {
        color: inherit;
    }

.c-movie__tile {
        position: relative;
        aspect-ratio: 16 / 9;
        overflow: hidden;
        background: var(--color-movie-bg);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-movie__tile img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--movie-pos, center);
               object-position: var(--movie-pos, center);
        }

.c-movie__tile::after {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(0, 0, 0, .08);
        }

.c-movie--simple .c-movie__tile {
        border-radius: var(--radius-product);
        -webkit-box-shadow: none;
                box-shadow: none;
    }

.c-movie--simple .c-movie__tile::after {
            display: none;
        }

.c-movie__play {
        position: absolute;
        top: 50%;
        left: 50%;
        z-index: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 64px;
        height: 46px;
        background: var(--color-red);
        border-radius: 10px;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-movie__play::before {
            content: "";
            margin-left: 4px;
            border-top: 10px solid transparent;
            border-bottom: 10px solid transparent;
            border-left: 17px solid var(--color-lightest);
        }

.c-movie__title {
        margin-top: 18px;
        font-size: 1.7rem;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-movie__title::after {
            content: "";
            display: block;
            width: 60px;
            height: 2px;
            margin-top: 12px;
            background: var(--color-accent);
        }

.c-movie--simple .c-movie__title {
        margin-top: 12px;
        font-size: 1.5rem;
        line-height: normal;
    }

.c-movie--simple .c-movie__title::after {
            display: none;
        }

/* リンク（YouTube）のときは再生ボタンで反応を示す */
a.c-movie:hover .c-movie__play {
    background: var(--color-red-hover);
}
/* ===================================================================
  CSS information
  file name  :  c-news.css
  お知らせ: 行カード（トップ）/ 記事カード（一覧）/ ミニ（サイドバー）
=================================================================== */

.c-news__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 16px;
        margin-top: 44px;
    }

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

.c-news__list {
            gap: 12px;
            margin-top: 28px
    }
        }

/* トップの行カード */

.c-news--row .c-news__item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 24px;
        /* デザインは content-box の min-height:70px（+ 上下 padding 24px） */
        min-height: 94px;
        padding: 12px 32px;
        color: inherit;
        background: var(--color-lightest);
        border-radius: var(--radius-row);
        -webkit-box-shadow: var(--shadow-card-weak);
                box-shadow: var(--shadow-card-weak);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-news--row .c-news__item:hover {
            color: inherit;
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

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

.c-news--row .c-news__item {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            gap: 8px;
            min-height: 0;
            padding: 14px 18px;
            border-radius: var(--radius-card)
    }
        }

.c-news__meta {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 24px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

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

.c-news__meta {
            gap: 10px
    }
        }

.c-news__date {
        font-family: var(--font-family-en);
        font-size: 1.4rem;
        color: var(--color-text-sub);
        white-space: nowrap;
    }

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

.c-news__date {
            font-size: 1.3rem
    }
        }

.c-news__tag {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 88px;
        padding: 5px 0;
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.5;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
    }

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

.c-news__tag {
            width: auto;
            padding: 3px 12px
    }
        }

.c-news__tag.is-filled {
            color: var(--color-lightest);
            background: var(--color-primary);
        }

.c-news--row .c-news__title {
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1.7;
        color: var(--color-primary);
    }

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

.c-news--row .c-news__title {
            font-size: 1.4rem;
            line-height: 1.6
    }
        }

/* デザインは中央揃えのブロック内のインラインリンク（行ボックスの基準線で 2px 下がる）ため flex にしない */

.c-news__more {
        margin-top: 28px;
        text-align: center;
    }

.c-news__more a {
            padding-bottom: 2px;
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--color-primary);
            border-bottom: 1px solid currentColor;
        }

.c-news__empty {
        margin-top: 32px;
        color: var(--color-text-sub);
    }

/* 一覧の記事カード */

.c-news--card .c-news__item {
        display: grid;
        grid-template-columns: 150px minmax(0, 1fr) auto;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 24px;
        padding: 16px 28px 16px 16px;
        color: inherit;
        background: var(--color-lightest);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-news--card .c-news__item:hover {
            color: inherit;
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

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

.c-news--card .c-news__item {
            grid-template-columns: minmax(0, 1fr);
            gap: 14px;
            padding: 14px 14px 20px
    }
        }

.c-news__thumb {
        display: block;
        width: 150px;
        height: 110px;
        overflow: hidden;
        border-radius: var(--radius-product);
    }

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

.c-news__thumb {
            width: 100%;
            height: 180px
    }
        }

.c-news__thumb img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-news--card .c-news__title {
        margin-top: 6px;
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.6;
        color: var(--color-text);
        word-break: auto-phrase;
    }

.c-news__excerpt {
        display: -webkit-box;
        margin-top: 6px;
        overflow: hidden;
        font-size: 1.3rem;
        line-height: 1.7;
        color: var(--color-text-sub);
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }

.c-news__arrow {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 40px;
        height: 40px;
        background: var(--color-pale-02);
        border-radius: 50%;
    }

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

.c-news__arrow {
            display: none
    }
        }

.c-news__arrow svg {
            width: 18px;
            height: 18px;
        }

.c-news--card .c-news__meta {
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 12px;
    }

.c-news--card .c-news__date {
        font-size: 1.3rem;
    }

/* トップの行カード: 塗りタグはデザインが枠なし（padding 6px）のため枠色を塗りと同色に */

.c-news--row .c-news__tag {
        line-height: normal;
    }

.c-news--row .c-news__tag.is-filled {
            border-color: var(--color-primary);
        }

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

.c-news--row .c-news__tag {
            font-size: 1.1rem
    }
        }

.c-news--card .c-news__tag {
        width: auto;
        padding: 3px 12px;
    }

/* ===================================================================
  CSS information
  file name  :  c-sidebar.css
  お知らせ サイドバー
=================================================================== */

.c-sidebar {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 28px;
    min-width: 0;
}

.c-sidebar__block {
        position: relative;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-sidebar__heading {
        padding: 14px 20px;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-primary);
    }

.c-sidebar__list {
        padding: 6px 20px 14px;
    }

.c-sidebar__link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 12px;
        padding: 13px 0;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-text);
        border-bottom: 1px solid var(--color-border-03);
    }

.c-sidebar__link:hover,
        .c-sidebar__link.is-current {
            color: var(--color-primary);
        }

.c-sidebar__icon {
        width: 24px;
        height: 24px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-sidebar__label {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        min-width: 0;
    }

.c-sidebar__count {
        font-family: var(--font-family-en);
        font-size: 1.3rem;
        font-weight: 400;
        color: var(--color-text-sub);
    }

.c-sidebar__chevron {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

/* よく読まれている記事 */

.c-sidebar__popular {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 14px;
        padding: 16px 20px;
    }

.c-sidebar__popular-link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 14px;
        padding-bottom: 14px;
        color: inherit;
        border-bottom: 1px solid var(--color-border-03);
    }

.c-sidebar__popular-link:hover {
            color: var(--color-primary);
        }

.c-sidebar__popular-thumb {
        display: block;
        width: 64px;
        height: 64px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        overflow: hidden;
        border-radius: var(--radius-image);
    }

.c-sidebar__popular-thumb img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-sidebar__popular-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        min-width: 0;
    }

.c-sidebar__popular-date {
        font-family: var(--font-family-en);
        font-size: 1.2rem;
        color: var(--color-text-sub);
    }

.c-sidebar__popular-title {
        margin-top: 4px;
        font-size: 1.4rem;
        font-weight: 700;
        line-height: 1.7;
        word-break: auto-phrase;
    }

/* サンプル CTA */

.c-sidebar__cta {
        padding: 26px 22px 96px;
        text-align: center;
        background: var(--color-pale-01);
    }

.c-sidebar__cta-bg {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: auto;
        pointer-events: none;
    }

.c-sidebar__cta-title {
        position: relative;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.6;
        letter-spacing: .04em;
        color: var(--color-primary);
    }

.c-sidebar__cta-lead {
        position: relative;
        margin-top: 8px;
        font-size: 1.3rem;
        line-height: 1.8;
    }

.c-sidebar__cta-btn {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin-top: 16px;
        padding: 15px 0;
        font-size: 1.5rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-lightest);
        background: var(--color-red);
        border-radius: var(--radius-btn);
    }

.c-sidebar__cta-btn:hover {
            color: var(--color-lightest);
            background: var(--color-red-hover);
        }

.c-sidebar__cta-sub {
        position: relative;
        margin-top: 14px;
        font-size: 1.2rem;
        line-height: 1.7;
        color: var(--color-text-sub);
    }

.c-sidebar__cta-tel {
        position: relative;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        margin-top: 4px;
        font-family: var(--font-family-en);
        font-size: 2.2rem;
        font-weight: 700;
        line-height: 1.2;
        color: var(--color-primary);
    }

.c-sidebar__cta-hours {
        position: relative;
        margin-top: 2px;
        font-size: 1.2rem;
        color: var(--color-text);
    }

/* 製品情報 */

.c-sidebar__products {
        padding: 26px 22px 28px;
    }

.c-sidebar__products-img {
        position: absolute;
        right: 18px;
        bottom: 20px;
        width: 40%;
        height: auto;
        pointer-events: none;
    }

.c-sidebar__products-title {
        position: relative;
        font-size: 1.6rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-primary);
    }

.c-sidebar__products-list {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 12px;
        max-width: 56%;
        margin-top: 16px;
        font-size: 1.4rem;
        font-weight: 700;
    }

.c-sidebar__products-list a {
            color: var(--color-text);
        }

.c-sidebar__products-list a:hover {
                color: var(--color-primary);
            }

/* ===================================================================
  CSS information
  file name  :  c-pagination.css
  ページ送り（44px 円）
=================================================================== */

.c-pagination {
    margin-top: 40px;
}

.c-pagination .page-numbers {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 10px;
    }

.c-pagination .page-numbers li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
        }

.c-pagination a.page-numbers,
    .c-pagination span.page-numbers {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        /* デザインは 44px + 枠 1px（content-box）= 46px。現在ページは枠なし 44px */
        width: 46px;
        height: 46px;
        font-family: var(--font-family-en);
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-border-02);
        border-radius: 50%;
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-pagination a.page-numbers:hover, .c-pagination span.page-numbers:hover {
            border-color: var(--color-primary);
        }

.c-pagination span.page-numbers.current {
        width: 44px;
        height: 44px;
        color: var(--color-lightest);
        background: var(--color-primary);
        border: 0;
    }

.c-pagination a.prev,
    .c-pagination a.next {
        font-family: var(--font-family-primary);
        font-weight: 400;
    }

.c-pagination span.page-numbers.dots {
        border: 0;
    }

/* ===================================================================
  CSS information
  file name  :  c-form.css
  お問い合わせフォーム（Contact Form 7 の出力を .c-form マークアップで装飾）
=================================================================== */

.c-form {
    margin-top: 40px;
}

.c-form__card {
        padding: 40px;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-form__card {
            padding: 24px 20px
    }
        }

.c-form.is-sent .c-form__body {
        display: none;
    }

.c-form__grid {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 24px;
    }

.c-form__row--2col {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
        gap: 24px;
    }

.c-form__label {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 8px;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-form__req {
        display: inline-block;
        padding: 3px 8px;
        font-size: 1.1rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-red);
        border-radius: var(--radius-badge);
    }

.c-form__opt {
        font-size: 1.2rem;
        font-weight: 400;
        color: var(--color-text-sub);
    }

.c-form .wpcf7-form-control-wrap {
        display: block;
        margin-top: 8px;
    }

.c-form__input,
    .c-form__select,
    .c-form__textarea {
        width: 100%;
        padding: 0 16px;
        font-family: inherit;
        font-size: 1.5rem;
        color: var(--color-text);
        background: var(--color-lightest);
        border: 1px solid var(--color-border-02);
        border-radius: var(--radius-btn);
        -webkit-transition: border-color .2s ease;
        transition: border-color .2s ease;
    }

.c-form__input:focus, .c-form__select:focus, .c-form__textarea:focus {
            outline: none;
            border-color: var(--color-primary);
        }

.c-form__input::-webkit-input-placeholder, .c-form__select::-webkit-input-placeholder, .c-form__textarea::-webkit-input-placeholder {
            color: var(--color-text-weak);
        }

.c-form__input::-moz-placeholder, .c-form__select::-moz-placeholder, .c-form__textarea::-moz-placeholder {
            color: var(--color-text-weak);
        }

.c-form__input:-ms-input-placeholder, .c-form__select:-ms-input-placeholder, .c-form__textarea:-ms-input-placeholder {
            color: var(--color-text-weak);
        }

.c-form__input::-ms-input-placeholder, .c-form__select::-ms-input-placeholder, .c-form__textarea::-ms-input-placeholder {
            color: var(--color-text-weak);
        }

.c-form__input::placeholder, .c-form__select::placeholder, .c-form__textarea::placeholder {
            color: var(--color-text-weak);
        }

.c-form__input,
    .c-form__select {
        height: 52px;
    }

.c-form__select {
        padding-left: 14px;
        padding-right: 44px;
        -webkit-appearance: none;
           -moz-appearance: none;
                appearance: none;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%231F7A34' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
        background-repeat: no-repeat;
        background-position: right 16px center;
    }

/* デザインは textarea がインライン（ベースライン揃え）のため、下にディセンダー分の余白が出る */

.c-form__textarea {
        vertical-align: baseline;
        height: 150px;
        padding: 14px 16px;
        line-height: 1.8;
        resize: vertical;
    }

.c-form .wpcf7-not-valid {
        border-color: var(--color-red);
    }

.c-form .wpcf7-not-valid-tip {
        display: block;
        margin-top: 6px;
        font-size: 1.3rem;
        color: var(--color-red-hover);
    }

/* スパム対策のハニーポット（画面にもスクリーンリーダーにも出さない。display:none は bot に見抜かれやすいので使わない） */

.c-form__hp {
        position: absolute;
        width: 0;
        height: 0;
        overflow: hidden;
        clip-path: inset(50%);
        white-space: nowrap;
    }

/* 同意 */

.c-form__agree {
        font-size: 1.5rem;
    }

.c-form__agree .wpcf7-form-control-wrap {
            display: inline;
            margin: 0;
        }

.c-form__agree .wpcf7-list-item {
            margin: 0;
        }

.c-form__agree label {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 12px;
            cursor: pointer;
        }

.c-form__agree input[type="checkbox"] {
            width: 20px;
            height: 20px;
            margin: 3px 3px 3px 4px;
            accent-color: var(--color-primary);
        }

/* 送信ボタン（input のため矢印はラッパーの疑似要素）。
       デザインは「ラベル + 16px + 26px アイコン」を中央に置くため、ラベルを中央から 21px 左へ寄せ、アイコンをその右に配置 */

.c-form__submit {
        position: relative;
        width: 300px;
        max-width: 100%;
        margin: 0 auto;
    }

.c-form__submit::after {
            content: "→";
            position: absolute;
            top: 50%;
            right: calc(50% - 97.5px);
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 26px;
            height: 26px;
            font-size: 14px;
            font-weight: 700;
            color: var(--color-red);
            background: var(--color-lightest);
            border-radius: var(--radius-btn-sm);
            -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);
            pointer-events: none;
        }

.c-form__submit:hover::after {
            color: var(--color-red-hover);
        }

.c-form__button {
        display: block;
        width: 100%;
        padding: 22px 70px 22px 28px;
        font-family: inherit;
        font-size: 1.7rem;
        font-weight: 700;
        text-align: center;
        color: var(--color-lightest);
        background: var(--color-red);
        border: 0;
        border-radius: var(--radius-btn);
        cursor: pointer;
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-form__button:hover {
            background: var(--color-red-hover);
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

.c-form__button:disabled {
            opacity: .6;
            cursor: not-allowed;
        }

.c-form .wpcf7-spinner {
        display: none;
    }

.c-form .wpcf7-response-output {
        margin: 0 !important;
        padding: 16px 20px !important;
        font-size: 1.4rem;
        line-height: 1.8;
        color: var(--color-red-hover);
        background: var(--color-error-bg);
        border: 0 !important;
        border-left: 4px solid var(--color-red) !important;
        border-radius: 0 var(--radius-btn) var(--radius-btn) 0;
    }

.c-form .wpcf7 form.sent .wpcf7-response-output {
        display: none;
    }

.c-form__missing {
        font-size: 1.4rem;
        color: var(--color-text-sub);
    }

/* 完了カード */

.c-form__complete {
        padding: 56px 40px;
        text-align: center;
    }

.c-form__complete-icon {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 72px;
        height: 72px;
        font-size: 32px;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: 50%;
    }

.c-form__complete-title {
        margin-top: 24px;
        font-size: 2.4rem;
        font-weight: 900;
        color: var(--color-primary);
    }

.c-form__complete-text {
        margin-top: 14px;
        font-size: 1.5rem;
        line-height: 1.9;
    }

.c-form__complete-btn {
        display: inline-block;
        margin-top: 28px;
        padding: 14px 28px;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-btn);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-form__complete-btn:hover {
            background: var(--color-pale-01);
        }

/* ===================================================================
  CSS information
  file name  :  c-footer.css
  全ページ共通でトップページのデザインに統一
  PC: 余白 44px / 36px・上線、会社情報 320px + 3 列 / SP: 余白 36px / 24px・上線なし、ロゴ行 → 住所 → 2 列リンクグリッド
=================================================================== */

.c-footer {
    position: relative;
    padding: 44px var(--padding-side) 36px;
    background: var(--color-lightest);
    border-top: 1px solid var(--color-border-01);
}

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

.c-footer {
        padding: 36px var(--padding-side) 24px;
        border-top: 0
}
    }

/* 会社情報 320px + リンク 3 列。3 列が 560px 未満になる幅（タブレット）ではリンクを会社情報の下に回す */

.c-footer__inner {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 40px;
        max-width: var(--width-main);
        margin: 0 auto;
    }

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

.c-footer__inner {
            display: block
    }
        }

.c-footer__brand {
        -webkit-box-flex: 0;
            -ms-flex: 0 1 320px;
                flex: 0 1 320px;
        min-width: 0;
    }

.c-footer__logo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        color: var(--color-primary);
    }

.c-footer__logo:hover {
            color: var(--color-primary);
        }

.c-footer__mark {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

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

.c-footer__mark {
            width: 30px;
            height: 30px
    }
        }

.c-footer__name {
        font-size: 1.7rem;
        font-weight: 900;
        color: var(--color-primary);
    }

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

.c-footer__name {
            font-size: 1.5rem
    }
        }

.c-footer__address {
        margin-top: 20px;
        font-size: 1.4rem;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-text);
    }

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

.c-footer__address {
            margin-top: 14px;
            font-size: 1.3rem;
            line-height: 1.8;
            letter-spacing: 0
    }
        }

.c-footer__tel {
        font-family: var(--font-family-en);
        font-weight: 700;
    }

.c-footer__cols {
        display: grid;
        -webkit-box-flex: 1;
            -ms-flex: 1 1 560px;
                flex: 1 1 560px;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 40px;
        min-width: 0;
    }

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

.c-footer__cols {
            display: none
    }
        }

.c-footer__col-title {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-footer__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 12px;
        margin-top: 16px;
        font-size: 1.4rem;
    }

.c-footer__link {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        color: var(--color-primary);
    }

.c-footer__link::before {
            content: "";
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: var(--color-accent);
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

/* SP: 2 列のリンクグリッド */

.c-footer__sp-links {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px 16px;
        margin-top: 20px;
        font-size: 1.3rem;
    }

.c-footer__copy-inner {
        max-width: var(--width-main);
        margin: 56px auto 0;
        padding-top: 20px;
        border-top: 1px solid var(--color-border-01);
        font-size: 1.3rem;
        color: var(--color-text-sub);
    }

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

.c-footer__copy-inner {
            margin-top: 24px;
            padding-top: 14px;
            font-size: 1.1rem
    }
        }

/* ===================================================================
  CSS information
  file name  :  c-page-home.css
  トップページ固有
=================================================================== */

/* PRODUCTS + EVIDENCE を包むアーチ（牧場写真） */

.c-page-home__arch {
        position: relative;
        margin-top: -96px;
        overflow: hidden;
        isolation: isolate;
    }

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

.c-page-home__arch {
            margin-top: -40px
    }
        }

.c-page-home__arch-bg {
        position: absolute;
        inset: 0 -15%;
        z-index: -1;
        overflow: hidden;
        background: var(--color-pasture-fill);
        border-radius: 50% 50% 0 0 / 110px 110px 0 0;
        pointer-events: none;
    }

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

.c-page-home__arch-bg {
            inset: 0 -20%;
            border-radius: 50% 50% 0 0 / 60px 60px 0 0
    }
        }

.c-page-home__arch-bg img {
            width: 100%;
            height: 960px;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: center bottom;
               object-position: center bottom;
        }

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

.c-page-home__arch-bg img {
                height: 100%;
                -o-object-position: center 30%;
                   object-position: center 30%
        }
            }

.c-page-home__arch-veil {
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .55)), color-stop(40%, rgba(255, 255, 255, .30)), to(rgba(255, 255, 255, .45)));
        background: linear-gradient(180deg, rgba(255, 255, 255, .55) 0%, rgba(255, 255, 255, .30) 40%, rgba(255, 255, 255, .45) 100%);
    }

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

.c-page-home__products {
            padding-bottom: 56px
    }
        }

.c-page-home__product-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px;
        margin-top: 28px;
    }

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

.c-page-home__product-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 20px
    }
        }

/* EVIDENCE */

.c-page-home__evidence {
        background-color: var(--color-cream-01);
    }

.c-page-home__evidence-bg {
        position: absolute;
        inset: 0;
        z-index: -1;
        pointer-events: none;
    }

.c-page-home__evidence-bg img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: left bottom;
               object-position: left bottom;
        }

.c-page-home__evidence-bg::before,
        .c-page-home__evidence-bg::after {
            content: "";
            position: absolute;
            inset: 0;
        }

.c-page-home__evidence-bg::before {
            background: -webkit-gradient(linear, left top, left bottom, from(rgba(250, 247, 230, .9)), color-stop(35%, rgba(250, 247, 230, .6)), color-stop(70%, rgba(250, 247, 230, .15)), to(rgba(250, 247, 230, 0)));
            background: linear-gradient(180deg, rgba(250, 247, 230, .9) 0%, rgba(250, 247, 230, .6) 35%, rgba(250, 247, 230, .15) 70%, rgba(250, 247, 230, 0) 100%);
        }

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

.c-page-home__evidence-bg::before {
                display: none
        }
            }

.c-page-home__evidence-bg::after {
            background: -webkit-gradient(linear, left top, right top, from(rgba(250, 247, 230, 0)), color-stop(30%, rgba(250, 247, 230, .2)), color-stop(50%, rgba(250, 247, 230, .7)), to(rgba(250, 247, 230, .8)));
            background: linear-gradient(90deg, rgba(250, 247, 230, 0) 0%, rgba(250, 247, 230, .2) 30%, rgba(250, 247, 230, .7) 50%, rgba(250, 247, 230, .8) 100%);
        }

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

.c-page-home__evidence-bg::after {
                background: -webkit-gradient(linear, left top, left bottom, from(rgba(250, 247, 230, .92)), color-stop(50%, rgba(250, 247, 230, .75)), to(rgba(250, 247, 230, .35)));
                background: linear-gradient(180deg, rgba(250, 247, 230, .92) 0%, rgba(250, 247, 230, .75) 50%, rgba(250, 247, 230, .35) 100%)
        }
            }

.c-page-home__evidence-grid {
        display: grid;
        grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
        gap: 48px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
    }

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

.c-page-home__evidence-grid {
            display: block
    }
        }

@media only screen and (min-width: 768px) {
            .c-page-home__evidence-head .c-heading {
                text-align: left;
            }
            .c-page-home__evidence-head .c-heading__lead {
                margin-left: 0;
                text-align: left;
            }
        }

.c-page-home__evidence-link {
        display: inline-block;
        margin-top: 24px;
        padding-bottom: 2px;
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
        border-bottom: 1px solid currentColor;
    }

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

.c-page-home__evidence-link {
            display: inline;
            margin-top: 0;
            font-size: 1.4rem
    }
        }

/* SP: デザインは中央揃えのブロック内のインラインリンク */

.c-page-home__evidence-more {
        margin-top: 24px;
        text-align: center;
    }

.c-page-home__evidence-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
    }

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

.c-page-home__evidence-list {
            gap: 16px;
            margin-top: 28px
    }
        }

/* BUSINESS */

.c-page-home__business-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 40px;
        margin-top: 28px;
    }

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

.c-page-home__business-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 18px
    }
        }

/* NEWS */

.c-page-home__news .c-news__list {
        margin-top: 28px;
    }

/* PC 見出し: h2 は行高 normal（EVIDENCE のみ 1.5）、PRODUCTS / EVIDENCE のリードは上 20px */

@media only screen and (min-width: 768px) {

.c-page-home__products .c-heading__title, .c-page-home__ecofeed .c-heading__title, .c-page-home__reason .c-heading__title, .c-page-home__business .c-heading__title, .c-page-home__news .c-heading__title {
                line-height: normal
        }
            }

@media only screen and (min-width: 768px) {

.c-page-home__products .c-heading__lead {
            margin-top: 20px;
            font-size: 1.6rem
    }
        }

@media only screen and (min-width: 768px) {

.c-page-home__evidence .c-heading__lead {
            margin-top: 20px
    }
        }

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

.c-page-home__news {
            padding-bottom: 96px
    }
        }

.c-page-home__news .c-news__more {
            margin-top: 32px;
        }

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

.c-page-home__news .c-news__more {
                margin-top: 24px
        }
                .c-page-home__news .c-news__more a {
                    font-size: 1.4rem;
                }
            }

/* 緑ボタン（詳しく見る）SP */

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

.c-page-home__products .c-btn--green, .c-page-home__business .c-btn--green {
                gap: 14px;
                padding: 12px 16px 12px 22px;
                font-size: 1.4rem
        }
                .c-page-home__products .c-btn--green .c-btn__icon, .c-page-home__business .c-btn--green .c-btn__icon {
                    width: 22px;
                    height: 22px;
                    font-size: 13px;
                }
            }

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

.c-page-home__voice {
            padding-bottom: 64px
    }
        }

/* ECO FEED: 3 ステップ（PC 横並び + →、SP 縦積み + ↓）と原料 2 カード */

.c-page-home__eco-steps {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 48px minmax(0, 1fr) 48px minmax(0, 1fr);
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        margin-top: 44px;
    }

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

.c-page-home__eco-steps {
            grid-template-columns: minmax(0, 1fr);
            margin-top: 28px
    }
        }

.c-page-home__eco-arrow {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        font-size: 2.8rem;
        line-height: 1;
        color: var(--color-accent);
    }

.c-page-home__eco-arrow::before {
            content: "→";
        }

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

.c-page-home__eco-arrow {
            padding: 8px 0;
            font-size: 2.4rem
    }
            .c-page-home__eco-arrow::before {
                content: "↓";
            }
        }

.c-page-home__eco-step {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 32px 26px 28px;
        text-align: center;
        background: var(--color-lightest);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-page-home__eco-step {
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            gap: 16px;
            padding: 16px;
            text-align: left;
            border-radius: var(--radius-card)
    }
        }

.c-page-home__eco-icon {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 110px;
        height: 110px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        background: var(--color-cream-01);
        border-radius: 50%;
    }

/* アイコンの実サイズは img の width/height（64 / 80）。SP は 3/4 に縮小 */

.c-page-home__eco-icon img {
            -o-object-fit: contain;
               object-fit: contain;
        }

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

.c-page-home__eco-icon img {
                width: auto;
                height: 75%;
                max-height: 60px
        }
            }

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

.c-page-home__eco-icon {
            width: 84px;
            height: 84px
    }
        }

.c-page-home__eco-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
    }

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

.c-page-home__eco-body {
            display: block;
            min-width: 0
    }
        }

.c-page-home__eco-label {
        font-family: var(--font-family-en);
        font-size: 1.3rem;
        font-weight: 700;
        letter-spacing: .14em;
        color: var(--color-red);
    }

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

.c-page-home__eco-label {
            font-size: 1.2rem
    }
        }

.c-page-home__eco-title {
        margin-top: -6px;
        font-size: 2.2rem;
        font-weight: 700;
        color: var(--color-primary);
    }

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

.c-page-home__eco-title {
            margin-top: 2px;
            font-size: 1.7rem
    }
        }

.c-page-home__eco-text {
        font-size: 1.4rem;
        line-height: 1.8;
        text-align: left;
    }

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

.c-page-home__eco-text {
            margin-top: 6px;
            font-size: 1.3rem;
            line-height: 1.7
    }
        }

.c-page-home__eco-materials {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 20px;
        max-width: 760px;
        margin: 28px auto 0;
    }

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

.c-page-home__eco-materials {
            grid-template-columns: minmax(0, 1fr);
            gap: 10px;
            margin-top: 24px
    }
        }

.c-page-home__eco-material {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 16px;
        padding: 18px 20px;
        background: var(--color-lightest);
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-qa);
    }

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

.c-page-home__eco-material {
            gap: 14px;
            padding: 14px 16px
    }
        }

.c-page-home__eco-material-media {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 72px;
        height: 72px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        overflow: hidden;
        background: var(--color-cream-01);
        border-radius: var(--radius-product);
    }

.c-page-home__eco-material-media img {
            width: 90%;
            height: 90%;
            -o-object-fit: contain;
               object-fit: contain;
        }

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

.c-page-home__eco-material-media {
            width: 60px;
            height: 60px
    }
        }

.c-page-home__eco-material-body {
        display: block;
        min-width: 0;
    }

.c-page-home__eco-material-name {
        display: block;
        font-size: 1.6rem;
        font-weight: 700;
        color: var(--color-primary);
    }

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

.c-page-home__eco-material-name {
            display: inline;
            font-size: 1.5rem
    }
        }

.c-page-home__eco-material-origin {
        display: block;
        margin-top: 2px;
        font-size: 1.3rem;
        font-weight: 700;
        color: var(--color-red);
    }

/* SP: 製品名の後ろに「｜原料：…」で続ける */

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

.c-page-home__eco-material-origin {
            display: inline;
            margin-top: 0;
            font-size: 1.2rem
    }
            .c-page-home__eco-material-origin::before {
                content: " ｜";
            }
        }

.c-page-home__eco-material-note {
        display: block;
        margin-top: 4px;
        font-size: 1.2rem;
        line-height: 1.7;
    }

/* トップ SP の CTA 見出しは 1 行 */
@media only screen and (max-width: 767px) {
.c-page-home .c-cta__title br {
        display: none
}
    }
/* ===================================================================
  CSS information
  file name  :  c-page-gut-health.css
  腸菌力シリーズ（ハブ）固有
=================================================================== */

/* PROBLEMS: クリームアーチ + コーナーリーフ */

.c-page-gut-health__problems .c-leaf {
        --leaf-w: min(34%, 520px);
        --leaf-x: 11%;
        --leaf-y: 0px;
        --leaf-w-sp: 200px;
        --leaf-x-sp: 14%;
    }

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

.c-page-gut-health__problems .c-leaf {
            opacity: .8
    }
        }

/* PROBLEMS: SP は横並びカード（96px アイコン + テキスト） */

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

.c-page-gut-health__problems {
            padding-top: 56px;
            padding-bottom: 56px
    }
        }

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

.c-page-gut-health__problem-grid .c-card--problem {
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            gap: 16px;
            padding: 16px 18px;
            text-align: left
    }
            .c-page-gut-health__problem-grid .c-card--problem .c-card__icon {
                width: 96px;
                height: 96px;
            }
            .c-page-gut-health__problem-grid .c-card--problem .c-card__text {
                -webkit-box-flex: 0;
                    -ms-flex: 0 1 auto;
                        flex: 0 1 auto;
                font-size: 1.5rem;
                letter-spacing: 0;
            }
            .c-page-gut-health__problem-grid .c-card--problem .c-card__rule {
                display: none;
            }
        }

.c-page-gut-health__problem-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 24px;
        margin-top: 44px;
    }

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

.c-page-gut-health__problem-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 14px;
            margin-top: 28px
    }
        }

/* SOLUTION */

.c-page-gut-health__story {
        background-color: var(--color-lightest);
    }

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

.c-page-gut-health__story {
            padding-top: 56px;
            padding-bottom: 56px
    }
        }

.c-page-gut-health__story .c-section__bg img {
            -o-object-position: center 30%;
               object-position: center 30%;
        }

.c-page-gut-health__story .c-section__bg::after {
            content: "";
            position: absolute;
            inset: 0;
            background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(10%, rgba(255, 255, 255, .9)), color-stop(30%, rgba(255, 255, 255, .55)), color-stop(60%, rgba(255, 255, 255, .35)), color-stop(90%, rgba(255, 255, 255, .6)), to(#fff));
            background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .9) 10%, rgba(255, 255, 255, .55) 30%, rgba(255, 255, 255, .35) 60%, rgba(255, 255, 255, .6) 90%, #fff 100%);
        }

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

.c-page-gut-health__story .c-section__bg::after {
                background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(12%, rgba(255, 255, 255, .92)), color-stop(40%, rgba(255, 255, 255, .7)), color-stop(70%, rgba(255, 255, 255, .7)), to(#fff));
                background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .92) 12%, rgba(255, 255, 255, .7) 40%, rgba(255, 255, 255, .7) 70%, #fff 100%)
        }
            }

.c-page-gut-health__story-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
        gap: 24px;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        margin-top: 48px;
    }

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

.c-page-gut-health__story-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 14px;
            margin-top: 28px
    }
        }

.c-page-gut-health__story-grid .c-numcard--step {
            -webkit-column-gap: 12px;
               -moz-column-gap: 12px;
                    column-gap: 12px;
        }

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

.c-page-gut-health__story-grid .c-numcard--step {
                -webkit-column-gap: 10px;
                   -moz-column-gap: 10px;
                        column-gap: 10px
        }
            }

.c-page-gut-health__story-grid .c-numcard--step .c-numcard__title {
                margin-top: 14px;
                line-height: 1.6;
            }

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

.c-page-gut-health__story-grid .c-numcard--step .c-numcard__title {
                    margin-top: 10px
            }
                }

.c-page-gut-health__story-grid .c-numcard--step .c-numcard__text {
                margin-top: 14px;
                letter-spacing: .04em;
            }

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

.c-page-gut-health__story-grid .c-numcard--step .c-numcard__text {
                    margin-top: 10px;
                    letter-spacing: 0
            }
                }

.c-page-gut-health__story-close {
        max-width: 820px;
        margin: 36px auto 0;
        font-size: 1.5rem;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-primary);
        text-align: center;
    }

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

.c-page-gut-health__story-close {
            margin-top: 24px;
            font-size: 1.4rem;
            letter-spacing: 0
    }
        }

/* PRODUCTS + COMPARE をまとめるクリームラッパー */

.c-page-gut-health__wrap {
        position: relative;
        overflow: hidden;
        background: var(--color-cream-01);
        isolation: isolate;
    }

.c-page-gut-health__products {
        padding-bottom: min(calc(48 / var(--width-base) * 100vw), 48px);
    }

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

.c-page-gut-health__products {
            padding-top: 56px;
            padding-bottom: 40px
    }
        }

.c-page-gut-health__products-sky {
        position: absolute;
        right: 0;
        top: 0;
        z-index: -1;
        width: min(62%, 900px);
        height: auto;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(55%, #000), color-stop(78%, rgba(0, 0, 0, .5)), to(transparent)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, #000));
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 55%, rgba(0, 0, 0, .5) 78%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 30%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(55%, #000), color-stop(78%, rgba(0, 0, 0, .5)), to(transparent)), -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, #000));
        mask-image: linear-gradient(180deg, #000 0%, #000 55%, rgba(0, 0, 0, .5) 78%, transparent 100%), linear-gradient(90deg, transparent 0%, #000 30%);
        -webkit-mask-composite: source-in;
        mask-composite: intersect;
        pointer-events: none;
    }

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

.c-page-gut-health__products-sky {
            width: 100%;
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), to(transparent));
            -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 100%);
            mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), to(transparent));
            mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 100%)
    }
        }

.c-page-gut-health__products-leaves {
        position: absolute;
        left: 0;
        top: 0;
        z-index: -1;
        width: min(40%, 560px);
        height: auto;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(95%, transparent)), -webkit-gradient(linear, left top, right top, from(#000), color-stop(50%, #000), color-stop(98%, transparent));
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 95%), linear-gradient(90deg, #000 0%, #000 50%, transparent 98%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(95%, transparent)), -webkit-gradient(linear, left top, right top, from(#000), color-stop(50%, #000), color-stop(98%, transparent));
        mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 95%), linear-gradient(90deg, #000 0%, #000 50%, transparent 98%);
        -webkit-mask-composite: source-in;
        mask-composite: intersect;
        pointer-events: none;
    }

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

.c-page-gut-health__products-leaves {
            display: none
    }
        }

.c-page-gut-health__product-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
        gap: 32px;
        margin-top: 48px;
    }

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

.c-page-gut-health__product-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 20px;
            margin-top: 28px
    }
        }

/* 製品カード: PC はテキスト + 画像 220px の 2 列、SP は画像（種別 pill 重ね）→ テキスト → ボタンの縦積み */

.c-page-gut-health__product {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 220px);
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
        gap: 20px 24px;
        padding: 32px 28px 28px;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-page-gut-health__product {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: stretch;
                -ms-flex-align: stretch;
                    align-items: stretch;
            gap: 10px;
            padding: 20px
    }
        }

.c-page-gut-health__product-text {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 12px;
        min-width: 0;
    }

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

.c-page-gut-health__product-text {
            display: contents
    }
        }

.c-page-gut-health__product-type {
        display: inline-block;
        padding: 5px 16px;
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
    }

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

.c-page-gut-health__product-type {
            -webkit-box-ordinal-group: 0;
                -ms-flex-order: -1;
                    order: -1;
            -ms-flex-item-align: start;
                align-self: flex-start;
            padding: 4px 12px;
            font-size: 1.1rem
    }
        }

.c-page-gut-health__product-sub {
        margin-top: 8px;
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-red);
    }

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

.c-page-gut-health__product-sub {
            margin-top: 0
    }
        }

.c-page-gut-health__product-title {
        font-size: clamp(26px, 2.4vw, 34px);
        font-weight: 900;
        line-height: 1.3;
        letter-spacing: .02em;
        color: var(--color-primary);
    }

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

.c-page-gut-health__product-title {
            font-size: 2.6rem
    }
        }

.c-page-gut-health__product-title::after {
            content: "";
            display: block;
            width: 32px;
            height: 3px;
            margin-top: 12px;
            border-radius: 2px;
            background: var(--color-accent);
        }

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

.c-page-gut-health__product-title::after {
                margin-top: 10px
        }
            }

.c-page-gut-health__product-body {
        margin-top: 6px;
        font-size: 1.4rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

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

.c-page-gut-health__product-body {
            margin-top: 0;
            font-size: 1.3rem;
            letter-spacing: 0
    }
        }

.c-page-gut-health__product-target {
        margin-top: 8px;
        font-size: 1.4rem;
        line-height: 1.7;
    }

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

.c-page-gut-health__product-target {
            margin-top: 0;
            font-size: 1.3rem
    }
        }

.c-page-gut-health__product-target strong {
            font-weight: 700;
        }

.c-page-gut-health__product-media {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        height: 270px;
        overflow: visible;
    }

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

.c-page-gut-health__product-media {
            -webkit-box-ordinal-group: 0;
                -ms-flex-order: -1;
                    order: -1;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 14px;
            height: auto;
            overflow: hidden
    }
        }

.c-page-gut-health__product-media img {
            width: 100%;
            height: 100%;
            -o-object-fit: contain;
               object-fit: contain;
        }

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

.c-page-gut-health__product-media img {
                height: 210px
        }
            }

.c-page-gut-health__product-media--m2 img {
            width: 118%;
            max-width: none;
            height: 118%;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

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

.c-page-gut-health__product-media--m2 img {
                width: 110%;
                height: 230px
        }
            }

.c-page-gut-health__product-btns {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 12px;
        grid-column: 1 / -1;
        margin-top: 4px;
    }

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

.c-page-gut-health__product-btns {
            display: grid;
            grid-template-columns: 1fr 1fr;
            gap: 10px;
            margin-top: 6px
    }
        }

.c-page-gut-health__product-btns .c-btn--green {
            gap: 20px;
            padding: 14px 26px 14px 30px;
            font-size: 1.5rem;
            border-radius: var(--radius-btn);
        }

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

.c-page-gut-health__product-btns .c-btn--green {
                -webkit-box-pack: center;
                    -ms-flex-pack: center;
                        justify-content: center;
                gap: 14px;
                padding: 13px 20px;
                font-size: 1.4rem
        }
            }

/* デザインは行高 normal の → スパン（ボタン高 52px） */

.c-page-gut-health__product-btns .c-btn--green .c-btn__icon {
                width: auto;
                height: auto;
                font-size: 16px;
                line-height: normal;
                color: var(--color-lightest);
                background: none;
            }

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

.c-page-gut-health__product-btns .c-btn--green .c-btn__icon {
                    font-size: 15px
            }
                }

.c-page-gut-health__product-pdf {
        font-size: 1.5rem;
        border-radius: var(--radius-btn);
    }

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

.c-page-gut-health__product-pdf {
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            gap: 8px;
            padding: 11px 16px;
            font-size: 1.4rem
    }
            .c-page-gut-health__product-pdf .c-pdf__icon {
                width: 18px;
                height: 21px;
            }
        }

.c-page-gut-health__product-pdf .c-pdf__icon {
            height: 23px;
        }

.c-page-gut-health__combo {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 16px;
        margin-top: 28px;
        padding: 18px 28px;
        font-size: 1.6rem;
        line-height: 1.8;
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-qa);
    }

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

.c-page-gut-health__combo {
            -webkit-box-pack: start;
                -ms-flex-pack: start;
                    justify-content: flex-start;
            gap: 12px;
            margin-top: 20px;
            padding: 14px 18px;
            font-size: 1.4rem
    }
        }

.c-page-gut-health__combo img {
            width: 34px;
            height: 34px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

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

.c-page-gut-health__combo img {
                width: 30px;
                height: 30px
        }
            }

.c-page-gut-health__combo strong {
            color: var(--color-primary);
        }

/* COMPARE */

.c-page-gut-health__compare {
        padding-top: min(calc(48 / var(--width-base) * 100vw), 48px);
        padding-bottom: min(calc(40 / var(--width-base) * 100vw), 40px);
    }

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

.c-page-gut-health__compare {
            padding-top: 40px;
            padding-bottom: 48px
    }
        }

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

.c-page-gut-health__compare .c-table--compare {
                gap: 12px
        }
            }

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

.c-page-gut-health__compare .c-table--compare .c-table__k {
                    line-height: normal
            }
                }

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

.c-page-gut-health__compare .c-table--compare .c-table__row {
                    background: var(--color-white-a96);
                    border-radius: var(--radius-qa);
                    -webkit-box-shadow: var(--shadow-card-mid);
                            box-shadow: var(--shadow-card-mid)
            }
                }

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

.c-page-gut-health__compare .c-table--compare .c-table__v::before {
                    display: block
            }
                }

.c-page-gut-health__compare-bg {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(30%, rgba(0, 0, 0, .5)), color-stop(55%, #000));
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .5) 30%, #000 55%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(30%, rgba(0, 0, 0, .5)), color-stop(55%, #000));
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .5) 30%, #000 55%);
        pointer-events: none;
    }

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

.c-page-gut-health__compare-bg {
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(60%, #000));
            -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 60%);
            mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(60%, #000));
            mask-image: linear-gradient(180deg, transparent 0%, #000 60%)
    }
        }

/* 旧キャッチ画像（headline_kenyaka.svg）の位置。画像は削除し、余白だけ同じ寸法で残す */

.c-page-gut-health__kenyaka {
        width: 317px;
        aspect-ratio: 317 / 58;
        margin: 44px auto 0;
    }

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

.c-page-gut-health__kenyaka {
            width: 270px;
            margin-top: 36px
    }
        }

/* EVIDENCE */

.c-page-gut-health__evidence {
        background: var(--gradient-sky);
    }

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

.c-page-gut-health__evidence {
            padding-top: 56px;
            padding-bottom: 56px
    }
        }

.c-page-gut-health__evidence-sky {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        pointer-events: none;
    }

.c-page-gut-health__evidence-leaves {
        position: absolute;
        right: 0;
        top: 0;
        z-index: -1;
        width: min(34%, 460px);
        height: auto;
        -webkit-transform: scaleX(-1);
                transform: scaleX(-1);
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(95%, transparent)), -webkit-gradient(linear, left top, right top, from(#000), color-stop(50%, #000), color-stop(98%, transparent));
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 95%), linear-gradient(90deg, #000 0%, #000 50%, transparent 98%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(95%, transparent)), -webkit-gradient(linear, left top, right top, from(#000), color-stop(50%, #000), color-stop(98%, transparent));
        mask-image: linear-gradient(180deg, #000 0%, #000 50%, transparent 95%), linear-gradient(90deg, #000 0%, #000 50%, transparent 98%);
        -webkit-mask-composite: source-in;
        mask-composite: intersect;
        pointer-events: none;
    }

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

.c-page-gut-health__evidence-leaves {
            display: none
    }
        }

.c-page-gut-health__evidence-odor {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        opacity: .85;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(35%, rgba(0, 0, 0, .45)), color-stop(60%, #000));
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .45) 35%, #000 60%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(35%, rgba(0, 0, 0, .45)), color-stop(60%, #000));
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .45) 35%, #000 60%);
        pointer-events: none;
    }

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

.c-page-gut-health__evidence-odor {
            -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(60%, #000));
            -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 60%);
            mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(60%, #000));
            mask-image: linear-gradient(180deg, transparent 0%, #000 60%)
    }
        }

/* M2 / MC のグループ（見出し + 2 枚のグリッド） */

.c-page-gut-health__evidence-groups {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 28px;
        margin-top: 48px;
    }

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

.c-page-gut-health__evidence-groups {
            gap: 16px;
            margin-top: 28px
    }
        }

.c-page-gut-health__evidence-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
        gap: 32px;
    }

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

.c-page-gut-health__evidence-grid {
            grid-template-columns: minmax(0, 1fr);
            gap: 16px
    }
        }

/* 消臭図（2 つの丸 + 矢印。矢印は丸の高さの中央） */

.c-page-gut-health__odor {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 28px;
        margin: 24px 0 8px;
    }

/* SP のデザインは block 内で下マージン 6px が本文の 12px と相殺されるため 0 */

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

.c-page-gut-health__odor {
            gap: 26px;
            margin: 18px 0 0
    }
        }

.c-page-gut-health__odor-item {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        width: 96px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

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

.c-page-gut-health__odor-item {
            width: 84px
    }
        }

/* デザインは content-box（NH₃ は枠 1px 分大きい 98px / SP 86px、抑制は枠なし） */

.c-page-gut-health__odor-circle {
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 96px;
        height: 96px;
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-text-sub);
        background: var(--color-pale-01);
        border: 1px solid var(--color-border-01);
        border-radius: 50%;
    }

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

.c-page-gut-health__odor-circle {
            width: 84px;
            height: 84px
    }
        }

.c-page-gut-health__odor-circle--after {
            font-size: 1.5rem;
            color: var(--color-lightest);
            background: var(--color-primary);
            border: 0;
        }

.c-page-gut-health__odor-label {
        margin-top: 10px;
        font-size: 1.3rem;
        color: var(--color-text-sub);
        text-align: center;
        white-space: nowrap;
    }

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

.c-page-gut-health__odor-label {
            margin-top: 8px;
            font-size: 1.2rem
    }
        }

.c-page-gut-health__odor-arrow {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        height: 96px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        font-size: 2.6rem;
        line-height: 1;
        color: var(--color-primary);
    }

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

.c-page-gut-health__odor-arrow {
            height: 84px;
            font-size: 2.4rem
    }
        }

/* VOICE / REASON の SP 余白（専用マークアップ） */

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

.c-page-gut-health .c-voice {
            padding-top: 56px;
            padding-bottom: 64px
    }
        }

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

.c-page-gut-health .c-reason {
            padding-top: 56px;
            padding-bottom: 96px
    }
        }

/* ===================================================================
  CSS information
  file name  :  c-page-product.css
  製品ページ（腸菌力-MC / 腸菌力-M2）共通
=================================================================== */

/* ヒーロー: PDF 白枠ボタン */
.c-btn--pdf-dark {
    gap: 12px;
    padding: 19px 26px;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.c-btn--pdf-dark .c-btn__icon {
        display: none;
    }

/* PROBLEMS のコーナーリーフ（左右） */

.c-page-product__problems .c-leaf--corner-l {
        --leaf-w: min(34%, 520px);
        --leaf-x: 11%;
        --leaf-y: 0px;
    }

.c-page-product__problems .c-leaf--corner-r {
        --leaf-w: min(28%, 420px);
        --leaf-x: 11%;
        --leaf-y: 0px;
    }

/* SOLUTION 背景 */

.c-page-product__solution .c-section__bg img {
        -o-object-position: center bottom;
           object-position: center bottom;
    }

.c-page-product__solution .c-section__bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(18%, rgba(255, 255, 255, .97)), color-stop(40%, rgba(255, 255, 255, .85)), color-stop(70%, rgba(255, 255, 255, .55)), to(rgba(255, 255, 255, .35)));
        background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .97) 18%, rgba(255, 255, 255, .85) 40%, rgba(255, 255, 255, .55) 70%, rgba(255, 255, 255, .35) 100%);
    }

/* クリーム + 牧場写真（TECHNOLOGY / LAB。写真の濃さとフェードはセクションごとにデザイン値） */

.c-page-product__cream-photo {
        background-color: var(--color-cream-01);
    }

.c-page-product__cream-photo .c-section__bg img {
            -o-object-position: center bottom;
               object-position: center bottom;
            opacity: .55;
        }

.c-page-product__cream-photo .c-section__bg::after {
            content: "";
            position: absolute;
            inset: 0;
            background: -webkit-gradient(linear, left top, left bottom, from(rgba(250, 247, 230, .95)), color-stop(35%, rgba(250, 247, 230, .85)), color-stop(70%, rgba(250, 247, 230, .55)), to(rgba(250, 247, 230, .3)));
            background: linear-gradient(180deg, rgba(250, 247, 230, .95) 0%, rgba(250, 247, 230, .85) 35%, rgba(250, 247, 230, .55) 70%, rgba(250, 247, 230, .3) 100%);
        }

.c-page-product__cream-photo--lab .c-section__bg img {
                opacity: .6;
            }

.c-page-product__cream-photo--lab .c-section__bg::after {
                background: -webkit-gradient(linear, left top, left bottom, from(rgba(250, 247, 230, .97)), color-stop(30%, rgba(250, 247, 230, .9)), color-stop(65%, rgba(250, 247, 230, .6)), to(rgba(250, 247, 230, .3)));
                background: linear-gradient(180deg, rgba(250, 247, 230, .97) 0%, rgba(250, 247, 230, .9) 30%, rgba(250, 247, 230, .6) 65%, rgba(250, 247, 230, .3) 100%);
            }

/* コーナーリーフ（セクション角、小） */

.c-page-product__corner-leaf {
        --leaf-w: min(24%, 340px);
        --leaf-x: 0;
        --leaf-y: 0px;
    }

/* 下辺の写真（消臭 / HOW TO USE / CAUTION） */

.c-page-product__bottom-photo {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        opacity: .85;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(30%, rgba(0, 0, 0, .35)), color-stop(55%, #000));
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 55%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(30%, rgba(0, 0, 0, .35)), color-stop(55%, #000));
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 55%);
        pointer-events: none;
    }

.c-page-product__bottom-photo--plain {
            opacity: 1;
            -webkit-mask-image: none;
            mask-image: none;
        }

/* ---------- TECHNOLOGY（SP もデザインは PC と同値） ---------- */

.c-page-product__pillar {
        padding: 28px 28px 32px;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__pillar-no {
        font-family: var(--font-family-en);
        font-size: 4rem;
        font-style: italic;
        font-weight: 700;
        line-height: 1;
        color: var(--color-num-light);
    }

.c-page-product__pillar-title {
        font-size: 1.9rem;
        font-weight: 700;
        line-height: 1.6;
        color: var(--color-primary);
    }

.c-page-product__pillar-img {
        width: 150px;
        height: 150px;
        -o-object-fit: contain;
           object-fit: contain;
    }

.c-page-product__pillar-text {
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

.c-page-product__barriers-heading {
        margin-top: 64px;
    }

.c-page-product__barriers-heading .c-heading__title {
            margin-top: 0;
            font-size: clamp(20px, 2vw, 26px);
            line-height: normal;
            letter-spacing: .04em;
        }

.c-page-product__barrier {
        padding: 22px 24px 26px;
        background: var(--color-pale-01-a96);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__barrier-badge {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        padding: 6px 18px 6px 6px;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.5; /* pill の高さをデザイン（40px）に合わせる */
        letter-spacing: .04em;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-pill);
    }

.c-page-product__barrier-badge span {
            display: -webkit-inline-box;
            display: -ms-inline-flexbox;
            display: inline-flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 28px;
            height: 28px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            /* Poppins の数字はディセンダを使わないぶん字面が上に寄るため、
               中央揃えの基準を下げる（flex の中央揃えでは padding の半分だけ動く） */
            padding-top: 2.8px;
            font-family: var(--font-family-en);
            font-size: 1.3rem;
            line-height: normal;
            letter-spacing: 0;
            color: var(--color-primary);
            background: var(--color-lightest);
            border-radius: 50%;
        }

.c-page-product__barrier-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start; /* 本文の長さが違ってもアイコンの上端を揃える */
        gap: 14px;
        margin-top: 16px;
    }

.c-page-product__barrier-body img {
            width: 120px;
            height: 120px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__barrier-body p {
            font-size: 1.4rem;
            line-height: 1.85;
            letter-spacing: .03em;
        }

.c-page-product__note {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 18px;
        margin-top: 24px;
        padding: 22px 28px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        background: var(--color-pale-01-a96);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__note img {
            width: 56px;
            height: 56px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

/* ---------- FEATURES / 効果（SP は効果カードのみ縦積み） ---------- */

.c-page-product__feature {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 18px;
        padding: 24px 26px;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__feature img {
            width: 120px;
            height: 120px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__feature h3 {
            font-size: 1.9rem;
            font-weight: 700;
            line-height: 1.5;
            color: var(--color-primary);
        }

.c-page-product__feature p {
            margin-top: 10px;
            font-size: 1.4rem;
            line-height: 1.85;
            letter-spacing: .03em;
        }

.c-page-product__effects-heading {
        margin-top: 72px;
    }

.c-page-product__effects-heading .c-heading__title {
            margin-top: 0;
            word-break: normal;
        }

.c-page-product__effect {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 18px;
        padding: 24px 26px 24px 22px;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-page-product__effect {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: stretch;
                -ms-flex-align: stretch;
                    align-items: stretch;
            padding: 24px 22px
    }
        }

.c-page-product__effect-no {
        position: absolute;
        top: 18px;
        left: 18px;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 44px;
        height: 44px;
        padding-top: 3.6px; /* 数字の字面を円の中央へ（flex 中央揃えでは padding の半分だけ動く） */
        font-family: var(--font-family-en);
        font-size: 1.6rem;
        font-weight: 700;
        line-height: normal;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: 50%;
    }

.c-page-product__effect-img {
        width: clamp(96px, 22%, 130px);
        height: auto;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        aspect-ratio: 1;
        margin: 28px 0 0 28px;
        -o-object-fit: contain;
           object-fit: contain;
    }

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

.c-page-product__effect-img {
            width: 120px;
            margin: 28px auto 0
    }
        }

.c-page-product__effect-body {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        -ms-flex-item-align: stretch;
            align-self: stretch;
        min-width: 0;
        padding-left: 18px;
        border-left: 2px solid var(--color-primary);
    }

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

.c-page-product__effect-body {
            padding: 16px 0 0;
            border-left: 0;
            border-top: 2px solid var(--color-primary)
    }
        }

.c-page-product__effect-body h4 {
            font-size: 1.8rem;
            font-weight: 700;
            line-height: 1.55;
            color: var(--color-primary);
            word-break: auto-phrase;
        }

.c-page-product__effect-body p {
            margin-top: 12px;
            font-size: 1.4rem;
            line-height: 1.85;
            letter-spacing: .03em;
        }

/* ---------- LAB DATA 引用 ---------- */

.c-page-product__quote {
        margin-top: 28px;
        padding: 22px 28px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        background: var(--color-white-a94);
        border-left: 4px solid var(--color-primary);
        border-radius: 0 var(--radius-card) var(--radius-card) 0;
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__quote strong {
            color: var(--color-primary);
        }

/* ---------- 抗生物質代替 背景（子豚） ---------- */

.c-page-product__piglets {
        position: absolute;
        right: 0;
        top: 0;
        z-index: -1;
        width: min(52%, 900px);
        height: auto;
        -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, rgba(0, 0, 0, .35)), color-stop(60%, #000)), -webkit-gradient(linear, left top, left bottom, color-stop(45%, #000), color-stop(75%, rgba(0, 0, 0, .4)), to(transparent));
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 60%), linear-gradient(180deg, #000 45%, rgba(0, 0, 0, .4) 75%, transparent 100%);
        mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, rgba(0, 0, 0, .35)), color-stop(60%, #000)), -webkit-gradient(linear, left top, left bottom, color-stop(45%, #000), color-stop(75%, rgba(0, 0, 0, .4)), to(transparent));
        mask-image: linear-gradient(90deg, transparent 0%, rgba(0, 0, 0, .35) 30%, #000 60%), linear-gradient(180deg, #000 45%, rgba(0, 0, 0, .4) 75%, transparent 100%);
        -webkit-mask-composite: source-in;
        mask-composite: intersect;
        pointer-events: none;
    }

.c-page-product__antibio-bottom {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: 100%;
        height: 45%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: center bottom;
           object-position: center bottom;
        opacity: .5;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(70%, #000));
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 70%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(70%, #000));
        mask-image: linear-gradient(180deg, transparent 0%, #000 70%);
        pointer-events: none;
    }

/* デザインは出典の下に空の行（margin-top:8px）がある */

.c-page-product__antibio-source {
        margin: 14px 0 8px;
    }

/* ---------- 受胎率（熊本R牧場）: 3 枚の比較。MC 給与は赤で強調 ---------- */

.c-page-product__conception {
        margin-top: var(--conception-mt);
    }

.c-page-product__conception-item {
        padding: var(--conception-item-padding);
        text-align: center;
        background: var(--color-pale-01);
        border: var(--border-emphasis) solid transparent;
        border-radius: var(--radius-card);
    }

.c-page-product__conception-item--mc {
            background: var(--color-lightest);
            border-color: var(--color-red);
            -webkit-box-shadow: var(--shadow-card);
                    box-shadow: var(--shadow-card);
        }

.c-page-product__conception-item--mc .c-page-product__conception-k,
            .c-page-product__conception-item--mc .c-page-product__conception-v {
                color: var(--color-red);
            }

.c-page-product__conception-k {
        font-size: 1.6rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-primary);
    }

.c-page-product__conception-v {
        margin-top: var(--conception-v-mt);
        font-family: var(--font-family-en);
        font-size: 4.8rem;
        font-weight: 700;
        line-height: 1.2;
        color: var(--color-text);
    }

.c-page-product__conception-v span {
            margin-left: var(--conception-unit-ml);
            font-size: 2rem;
        }

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

.c-page-product__conception-v {
            font-size: 4rem
    }
        }

.c-page-product__conception-n {
        margin-top: var(--conception-n-mt);
        font-size: 1.4rem;
        letter-spacing: .04em;
    }

.c-page-product__conception-source {
        margin-top: var(--conception-source-mt);
    }

/* ---------- クロストリジウム（SP は縦積み・アイコン中央、本文は左揃え） ---------- */

.c-page-product__case {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 24px;
        padding: 32px 30px;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

/* 事例が 1 件のときは全幅に伸ばさず中央に置く */

.c-page-product__case:only-child {
            justify-self: center;
            width: 100%;
            max-width: var(--width-narrow);
        }

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

.c-page-product__case {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 18px;
            padding: 28px 22px
    }
        }

.c-page-product__case img {
            width: 120px;
            height: 120px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__case h3 {
            font-size: 2rem;
            font-weight: 700;
            line-height: 1.5;
            color: var(--color-primary);
        }

.c-page-product__case h3::after {
                content: "";
                display: block;
                width: 36px;
                height: 2px;
                margin-top: 12px;
                background: var(--color-accent);
            }

.c-page-product__case p {
            margin-top: 14px;
            font-size: 1.5rem;
            line-height: 1.9;
            letter-spacing: .04em;
            text-align: left;
        }

.c-page-product__case-body {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        width: 100%;
        min-width: 0;
    }

/* ---------- 消臭（SP もデザインは PC と同値） ---------- */

.c-page-product__mech {
        padding: 26px 28px;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__mech p {
            margin-top: 14px;
            font-size: 1.5rem;
            line-height: 1.9;
            letter-spacing: .04em;
        }

.c-page-product__mech-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 16px;
    }

.c-page-product__mech-head img {
            width: 96px;
            height: 96px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-page-product__mech-head > div {
            min-width: 0;
        }

.c-page-product__mech-head h3 {
            margin-top: 6px;
            font-size: 1.8rem;
            font-weight: 700;
            line-height: 1.5;
            color: var(--color-primary);
            word-break: auto-phrase;
        }

.c-page-product__mech-step {
        display: block;
        font-family: var(--font-family-en);
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1;
        color: var(--color-red);
    }

.c-page-product__linechart {
        margin-top: 32px;
        padding: clamp(24px, 3.5vw, 40px);
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__linechart h3 {
            font-size: 2.2rem;
            font-weight: 900;
            color: var(--color-primary);
        }

.c-page-product__linechart .c-page-product__chart-sub {
            margin-top: 8px;
            font-size: 1.4rem;
            line-height: 1.9;
            color: var(--color-text-sub);
        }

.c-page-product__linechart .c-page-product__chart-foot {
            margin-top: 14px;
            font-size: 1.3rem;
            line-height: 1.9;
            color: var(--color-text-sub);
            text-align: left;
        }

.c-page-product__odor-svg {
        display: block;
        width: 100%;
        height: auto;
        margin-top: 16px;
        overflow: visible;
    }

.c-page-product__legend {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 28px;
        margin-top: 20px;
        font-size: 1.4rem;
        font-weight: 700;
    }

.c-page-product__legend span {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 10px;
        }

.c-page-product__legend span::before {
                content: "";
                width: 26px;
                -webkit-box-flex: 0;
                    -ms-flex: none;
                        flex: none;
            }

.c-page-product__legend .is-mc {
            color: var(--color-red);
        }

.c-page-product__legend .is-mc::before {
                height: 3px;
                background: var(--color-red);
                border-radius: 2px;
            }

.c-page-product__legend .is-ctrl {
            color: var(--color-text-sub);
        }

.c-page-product__legend .is-ctrl::before {
                height: 0;
                border-top: 3px dashed var(--color-text-sub);
            }

.c-page-product__result {
        overflow: hidden;
        background: var(--color-white-a94);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__result .c-page-product__result-head {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 12px;
            padding: 14px 24px;
            color: var(--color-lightest);
            background: var(--gradient-green-band);
        }

.c-page-product__result .c-page-product__result-head img {
                width: 26px;
                height: 30px;
                -webkit-filter: brightness(0) invert(1);
                        filter: brightness(0) invert(1);
            }

.c-page-product__result .c-page-product__result-head h3 {
                font-size: 1.9rem;
                font-weight: 700;
            }

.c-page-product__result .c-page-product__result-head--merit {
                color: var(--color-primary);
                background: var(--color-pale-04);
            }

.c-page-product__result .c-page-product__result-head--merit img {
                    width: 24px;
                    height: 32px;
                    -webkit-filter: none;
                            filter: none;
                }

.c-page-product__result .c-page-product__result-head--merit h3 {
                    font-size: 1.8rem;
                }

.c-page-product__result .c-page-product__result-body {
            padding: 8px 28px 20px;
        }

.c-page-product__result .c-page-product__result-row {
            padding: 16px 0;
        }

.c-page-product__result .c-page-product__result-row + .c-page-product__result-row {
                border-top: 1px solid var(--color-border-01);
            }

.c-page-product__result .c-page-product__result-row dt {
                font-size: 1.5rem;
                font-weight: 700;
                color: var(--color-primary);
            }

.c-page-product__result .c-page-product__result-row dd {
                margin-top: 6px;
                font-size: 1.5rem;
                line-height: 1.9;
                letter-spacing: .04em;
            }

.c-page-product__result .c-page-product__merit-list {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 12px;
            padding: 20px 24px 24px;
        }

.c-page-product__result .c-page-product__merit-list li {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 12px;
                font-size: 1.5rem;
                line-height: 1.9;
                letter-spacing: .04em;
            }

.c-page-product__result .c-page-product__merit-list li::before {
                    content: "✓";
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                        -ms-flex-align: center;
                            align-items: center;
                    -webkit-box-pack: center;
                        -ms-flex-pack: center;
                            justify-content: center;
                    width: 22px;
                    height: 22px;
                    -webkit-box-flex: 0;
                        -ms-flex: none;
                            flex: none;
                    margin-top: 3px;
                    font-size: 1.3rem;
                    line-height: normal;
                    color: var(--color-lightest);
                    background: var(--color-accent);
                    border-radius: 50%;
                }

.c-page-product__result-side {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
    }

.c-page-product__method {
        padding: 22px 24px 24px;
        background: var(--color-pale-01-f0);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__method .c-page-product__method-head {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            gap: 10px;
            font-size: 1.6rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-product__method .c-page-product__method-head img {
                width: 24px;
                height: 30px;
            }

.c-page-product__method p {
            margin-top: 8px;
            font-size: 1.4rem;
            line-height: 1.9;
        }

.c-page-product__method .c-source {
            margin-top: 12px;
            font-size: 1.3rem;
            line-height: normal;
        }

/* ---------- HOW TO USE ---------- */

.c-page-product__cost-wrap {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
    }

.c-page-product__cost {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 20px;
        padding: 22px 28px 22px 22px;
        overflow: hidden;
        background: var(--color-white-a96);
        border: 1.5px solid var(--color-accent);
        border-radius: var(--radius-card);
    }

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

.c-page-product__cost {
            gap: 14px;
            padding: 18px 16px
    }
        }

.c-page-product__cost .c-page-product__cost-leaf {
            position: absolute;
            right: 14px;
            bottom: -6px;
            width: 84px;
            height: 84px;
            -o-object-fit: contain;
               object-fit: contain;
            opacity: .5;
            pointer-events: none;
        }

.c-page-product__cost .c-page-product__cost-img {
            width: 150px;
            height: auto;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

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

.c-page-product__cost .c-page-product__cost-img {
                width: 104px
        }
            }

.c-page-product__cost-body {
        position: relative;
        min-width: 0;
    }

.c-page-product__cost-k {
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-page-product__cost-price {
        margin-top: 4px;
        font-size: 2.2rem;
        font-weight: 900;
        line-height: 1.2;
        color: var(--color-primary);
        white-space: nowrap;
    }

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

.c-page-product__cost-price {
            font-size: 1.7rem
    }
        }

.c-page-product__cost-price strong {
            font-family: var(--font-family-en);
            font-size: 4.4rem;
            font-weight: 900;
            background: var(--gradient-hl-price);
        }

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

.c-page-product__cost-price strong {
                font-size: 3.6rem
        }
            }

.c-page-product__cost-per {
        margin-left: 6px;
    }

.c-page-product__cost-sub {
        margin-top: 6px;
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-text);
    }

/* ---------- CAUTION（SP はカード縦積み・本文左揃え） ---------- */

.c-page-product__caution-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
        margin-top: 32px;
    }

.c-page-product__caution {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 22px;
        padding: 24px 28px;
        background: var(--color-lightest);
        border-left: 6px solid var(--color-red);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card-soft);
                box-shadow: var(--shadow-card-soft);
    }

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

.c-page-product__caution {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 14px;
            padding: 22px 20px
    }
        }

.c-page-product__caution img {
            width: 96px;
            height: 96px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-page-product__caution-body {
        width: 100%;
        min-width: 0;
    }

/* デザインは補足文が空でも p（margin-top 6px）を出力するため、その分の高さを確保 */

.c-page-product__caution-body--nosub {
            padding-bottom: 6px;
        }

.c-page-product__caution-lead {
        font-size: 1.8rem;
        font-weight: 700;
        line-height: 1.7;
        letter-spacing: .04em;
        word-break: auto-phrase;
    }

.c-page-product__caution-lead span {
            color: var(--color-red);
        }

.c-page-product__caution-sub {
        margin-top: 6px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

/* ---------- SPEC ---------- */

.c-page-product__spec-table {
        margin-top: 40px;
    }

.c-page-product__spec-pdf {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        margin-top: 28px;
    }

.c-page-product__spec-pdf .c-btn--outline-green:not(.c-btn--strong) {
            gap: 12px;
        }

.c-page-product__spec-tagline {
        margin-top: 20px;
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-primary);
        text-align: center;
    }

/* ---------- 併用カード（緑グラデの丸 + 本文 + ボタン。SP は縦積み・丸が上にはみ出す） ---------- */

.c-page-product__combo {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 40px;
        margin-top: 56px;
        padding: 36px 40px;
        background: var(--color-white-a96);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-page-product__combo {
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 24px;
            margin-top: 110px;
            padding: 0 20px 24px
    }
        }

.c-page-product__combo-circle {
        position: relative;
        width: 230px;
        height: 230px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        margin: -70px 0 -50px -110px;
    }

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

.c-page-product__combo-circle {
            margin: -60px 0 8px 0
    }
        }

.c-page-product__combo-circle .c-page-product__combo-inner {
            width: 230px;
            height: 230px;
            overflow: hidden;
            background: var(--gradient-combo);
            border-radius: 50%;
            -webkit-box-shadow: var(--shadow-combo);
                    box-shadow: var(--shadow-combo);
        }

.c-page-product__combo-circle img {
            width: 100%;
            height: 100%;
            -o-object-fit: contain;
               object-fit: contain;
            -webkit-transform: scale(var(--combo-scale, 1.35));
                    transform: scale(var(--combo-scale, 1.35));
        }

.c-page-product__combo-circle .c-page-product__combo-strokes {
            position: absolute;
            right: -22px;
            top: -2px;
            width: 74px;
            height: 72px;
            -webkit-transform: rotate(7deg);
                    transform: rotate(7deg);
        }

.c-page-product__combo-body {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        width: 100%;
        min-width: 260px;
    }

.c-page-product__combo-title {
        font-size: 2.4rem;
        font-weight: 700;
        line-height: 1.5;
        color: var(--color-text);
        word-break: auto-phrase;
    }

.c-page-product__combo-title .c-hl {
            color: var(--color-primary);
        }

.c-page-product__combo-text {
        margin-top: 12px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

.c-page-product__combo-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-page-product__combo-btn .c-btn {
            gap: 20px;
            padding: 22px 32px 22px 40px;
            font-size: 1.7rem;
            border-radius: var(--radius-btn-outline);
        }

.c-page-product__combo-btn .c-btn .c-btn__arrow {
                margin-left: 0;
            }

/* ---------- M2: IGF-1（SP もデザインは PC と同値） ---------- */

.c-page-product__igf-outline {
        max-width: 860px;
        margin: 18px auto 0;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        text-align: center;
    }

/* デザインの max-width は content-box（+ 左右 padding）のため box-sizing を合わせる */

.c-page-product__bigchart {
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        max-width: 900px;
        margin: 44px auto 0;
        padding: clamp(28px, 4vw, 48px) clamp(20px, 4vw, 56px);
        background: var(--color-white-a96);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__bigchart--growth {
            -webkit-box-sizing: border-box;
                    box-sizing: border-box;
            max-width: none;
            padding: clamp(24px, 3.5vw, 40px);
            background: var(--color-white-a97);
        }

.c-page-product__chart-pill-wrap {
        text-align: center;
    }

.c-page-product__chart-pill {
        display: inline-block;
        padding: 10px 26px;
        font-size: 1.5rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-primary);
        background: var(--color-pale-03);
        border-radius: var(--radius-pill);
    }

.c-page-product__igf-svg {
        display: block;
        width: 100%;
        max-width: 720px;
        height: auto;
        margin: 28px auto 0;
    }

.c-page-product__growth-svg {
        display: block;
        width: 100%;
        height: auto;
        margin-top: 24px;
    }

.c-page-product__chart-foot {
        margin-top: 24px;
        font-size: 1.3rem;
        line-height: 1.9;
        color: var(--color-text-sub);
        text-align: center;
    }

.c-page-product__callout {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 20px;
        -webkit-box-sizing: content-box;
                box-sizing: content-box;
        max-width: 960px;
        margin: 32px auto 0;
        padding: 26px 30px;
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.9;
        letter-spacing: .04em;
        color: var(--color-primary);
        background: var(--color-pale-03);
        border-left: 5px solid var(--color-primary);
        border-radius: 0 var(--radius-qa) var(--radius-qa) 0;
    }

.c-page-product__callout svg {
            width: 44px;
            height: 44px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-page-product__callout + .c-source {
            margin-top: 16px;
        }

/* ---------- M2: 増体推移 ---------- */

.c-page-product__growth {
        background: var(--gradient-sky-m2);
    }

.c-page-product__growth-sky {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        pointer-events: none;
    }

.c-page-product__growth-bottom {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: 100%;
        height: 640px;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: center bottom;
           object-position: center bottom;
        opacity: .6;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(22%, rgba(0, 0, 0, .25)), color-stop(42%, rgba(0, 0, 0, .7)), color-stop(60%, #000));
        -webkit-mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .25) 22%, rgba(0, 0, 0, .7) 42%, #000 60%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(22%, rgba(0, 0, 0, .25)), color-stop(42%, rgba(0, 0, 0, .7)), color-stop(60%, #000));
        mask-image: linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, .25) 22%, rgba(0, 0, 0, .7) 42%, #000 60%);
        pointer-events: none;
    }

.c-page-product__growth-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 16px;
    }

.c-page-product__growth-head svg {
            width: 46px;
            height: 46px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-page-product__growth-head h3 {
            font-size: 2.1rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-product__growth-head h3 span {
                font-size: 1.6rem;
            }

.c-page-product__growth-sub {
        margin-top: 6px;
        font-size: 1.3rem;
        line-height: 1.8;
        color: var(--color-text-sub);
    }

.c-page-product__market {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 28px;
        margin-top: 44px;
        padding: 36px 40px;
        overflow: hidden;
        background: var(--color-cream-02);
        border-radius: var(--radius-card);
    }

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

.c-page-product__market {
            gap: 16px;
            padding: 24px 20px
    }
        }

.c-page-product__market .c-page-product__market-bg {
            position: absolute;
            right: 0;
            bottom: 0;
            width: 62%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: right 60%;
               object-position: right 60%;
        }

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

.c-page-product__market .c-page-product__market-bg {
                display: none
        }
            }

.c-page-product__market::after {
            content: "";
            position: absolute;
            inset: 0;
            background: -webkit-gradient(linear, left top, right top, from(#FBF5D6), color-stop(40%, #FBF5D6), color-stop(52%, rgba(251, 245, 214, .9)), color-stop(68%, rgba(251, 245, 214, .4)), color-stop(85%, rgba(251, 245, 214, 0)));
            background: linear-gradient(90deg, #FBF5D6 0%, #FBF5D6 40%, rgba(251, 245, 214, .9) 52%, rgba(251, 245, 214, .4) 68%, rgba(251, 245, 214, 0) 85%);
            pointer-events: none;
        }

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

.c-page-product__market::after {
                display: none
        }
            }

.c-page-product__market .c-page-product__market-badge {
            position: relative;
            z-index: 1;
            display: inline-block;
            margin-top: 4px;
            padding: 8px 22px;
            font-family: var(--font-family-en);
            font-size: 1.3rem;
            font-weight: 700;
            letter-spacing: .14em;
            color: var(--color-red);
            border: 2px solid var(--color-red);
            border-radius: var(--radius-pill);
        }

.c-page-product__market .c-page-product__market-body {
            position: relative;
            z-index: 1;
            max-width: 58%;
        }

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

.c-page-product__market .c-page-product__market-body {
                max-width: 100%
        }
            }

.c-page-product__market .c-page-product__market-body{
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            min-width: 260px;
}

.c-page-product__market .c-page-product__market-body h3 {
                font-size: 2.2rem;
                font-weight: 700;
                line-height: 1.6;
                color: var(--color-primary);
                word-break: auto-phrase;
            }

.c-page-product__market .c-page-product__market-body p {
                margin-top: 10px;
                font-size: 1.5rem;
                line-height: 1.9;
                letter-spacing: .04em;
            }

.c-page-product__market .c-page-product__market-body .c-page-product__market-source {
                margin-top: 14px;
                font-size: 1.3rem;
                line-height: normal;
                letter-spacing: 0;
            }

/* ---------- M2: TMR（A マーキー / B 麹菌比較 / C コスト表 / D 効果ポイント。SP もデザインは PC と同値） ---------- */

.c-page-product__tmr {
        background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(55%, #fff), to(#F3F7EE));
        background: linear-gradient(180deg, #fff 0%, #fff 55%, #F3F7EE 100%);
    }

/* A: 流れるスライダー（同じ 4 枚を 2 周並べ、トラックを -50% まで動かして無限ループ。hover で停止） */

.c-page-product__tmr-marquee {
        margin: 44px calc(50% - 50vw) 0;
        overflow: hidden;
    }

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

.c-page-product__tmr-marquee {
            margin: 44px calc(-1 * var(--padding-side)) 0
    }
        }

.c-page-product__tmr-marquee:hover .c-page-product__tmr-track {
            -webkit-animation-play-state: paused;
                    animation-play-state: paused;
        }

.c-page-product__tmr-track {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        will-change: transform;
        -webkit-animation: c-tmr-marquee 50s linear infinite;
                animation: c-tmr-marquee 50s linear infinite;
    }

.c-page-product__tmr-slide {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 12px;
        width: 380px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        margin: 0 20px 0 0;
    }

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

.c-page-product__tmr-slide {
            width: 280px
    }
        }

.c-page-product__tmr-slide-media {
        position: relative;
        height: 250px;
        overflow: hidden;
        background: var(--color-pale-03);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__tmr-slide-media img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--tmr-pos, center);
               object-position: var(--tmr-pos, center);
        }

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

.c-page-product__tmr-slide-media {
            height: 190px
    }
        }

.c-page-product__tmr-slide-no {
        position: absolute;
        top: 12px;
        left: 12px;
        padding: 4px 12px;
        font-family: var(--font-family-en);
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .1em;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-pill);
    }

.c-page-product__tmr-slide-body strong {
            display: block;
            font-size: 1.6rem;
            font-weight: 700;
            line-height: 1.5;
            color: var(--color-primary);
        }

.c-page-product__tmr-slide-body p {
            margin-top: 6px;
            font-size: 1.3rem;
            line-height: 1.8;
        }

/* B〜D 共通の小見出し（中央・サブは赤） */

.c-page-product__tmr-h3 {
        font-size: clamp(22px, 2.2vw, 28px);
        font-weight: 900;
        line-height: 1.5;
        letter-spacing: .04em;
        text-align: center;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-page-product__tmr-h3-sub {
        display: block;
        margin-top: 6px;
        font-size: 1.5rem;
        font-weight: 700;
        letter-spacing: .06em;
        color: var(--color-red);
    }

/* B: なぜ、麹菌なのか（一般的な方法 = グレー / 腸菌力-M2 = 緑枠） */

.c-page-product__koji {
        margin-top: 72px;
    }

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

.c-page-product__koji {
            margin-top: 56px
    }
        }

.c-page-product__koji-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
        gap: 24px;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        margin-top: 28px;
    }

.c-page-product__koji-card {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
        padding: 28px 26px 30px;
        border-radius: var(--radius-card-lg);
    }

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

.c-page-product__koji-card {
            gap: 16px;
            padding: 22px 16px 24px
    }
        }

.c-page-product__koji-card--plain {
            background: var(--color-gray-bg);
        }

.c-page-product__koji-card--plain .c-page-product__koji-pill {
                color: var(--color-text-sub);
                border: 1px solid var(--color-hairline);
            }

.c-page-product__koji-card--plain .c-page-product__koji-title {
                color: var(--color-gray-text);
            }

.c-page-product__koji-card--plain .c-page-product__koji-arrow {
                color: var(--color-hairline);
            }

.c-page-product__koji-card--plain .c-page-product__koji-li::before {
                background: var(--color-text-sub);
            }

.c-page-product__koji-card--m2 {
            background: var(--gradient-koji);
            border: 2px solid var(--color-accent);
            -webkit-box-shadow: var(--shadow-koji);
                    box-shadow: var(--shadow-koji);
        }

.c-page-product__koji-card--m2 .c-page-product__koji-pill {
                color: var(--color-lightest);
                background: var(--color-primary);
            }

.c-page-product__koji-card--m2 .c-page-product__koji-title {
                color: var(--color-primary);
            }

.c-page-product__koji-card--m2 .c-page-product__koji-arrow {
                color: var(--color-accent);
            }

.c-page-product__koji-card--m2 .c-page-product__koji-li::before {
                background: var(--color-primary);
            }

/* ④（二段階発酵）は赤で強調 */

.c-page-product__koji-card .c-page-product__koji-li--em::before {
            background: var(--color-red);
        }

.c-page-product__koji-pill {
        display: inline-block;
        padding: 4px 12px;
        font-size: 1.2rem;
        font-weight: 700;
        border-radius: var(--radius-pill);
    }

.c-page-product__koji-title {
        margin-top: 10px;
        font-size: 2rem;
        font-weight: 700;
        line-height: 1.5;
    }

.c-page-product__koji-title-sub {
        font-size: 1.5rem;
        color: var(--color-red);
    }

.c-page-product__koji-flow {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
        -webkit-box-align: end;
            -ms-flex-align: end;
                align-items: end;
        gap: 6px;
        padding: 6px 0;
        text-align: center;
    }

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

.c-page-product__koji-flow {
            gap: 2px
    }
        }

.c-page-product__koji-arrow {
        padding-bottom: 28px;
        font-size: 2.2rem;
        line-height: 1;
    }

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

.c-page-product__koji-arrow {
            font-size: 1.6rem
    }
        }

.c-page-product__koji-arrow::before {
            content: "→";
        }

.c-page-product__koji-item {
        --koji-ring: var(--color-gray-ring);
        --koji-label: var(--color-gray-text);
        --koji-sub: var(--color-text-sub);
    }

.c-page-product__koji-item--red {
            --koji-ring: var(--color-red);
            --koji-label: var(--color-red);
            --koji-sub: var(--color-red);
        }

.c-page-product__koji-item--green {
            --koji-ring: var(--color-primary);
            --koji-label: var(--color-primary);
            --koji-sub: var(--color-primary);
        }

.c-page-product__koji-item--accent {
            --koji-ring: var(--color-accent);
            --koji-label: var(--color-primary);
            --koji-sub: var(--color-primary);
        }

.c-page-product__koji-photo {
        display: block;
        width: clamp(84px, 9vw, 112px);
        height: clamp(84px, 9vw, 112px);
        margin: 0 auto;
        overflow: hidden;
    }

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

.c-page-product__koji-photo {
            width: 78px;
            height: 78px
    }
        }

.c-page-product__koji-photo{
        border: 3px solid var(--koji-ring);
        border-radius: 50%;
        -webkit-box-shadow: var(--shadow-photo);
                box-shadow: var(--shadow-photo);
}

.c-page-product__koji-photo img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-page-product__koji-label {
        display: block;
        margin-top: 10px;
        font-size: 1.3rem;
        font-weight: 700;
        line-height: 1.4;
        color: var(--koji-label);
    }

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

.c-page-product__koji-label {
            font-size: 1.2rem
    }
        }

.c-page-product__koji-label small {
            display: block;
            font-size: inherit;
            font-weight: 400;
            color: var(--koji-sub);
        }

.c-page-product__koji-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 10px;
        padding: 0;
        list-style: none;
        counter-reset: koji;
    }

.c-page-product__koji-li {
        position: relative;
        padding-left: 32px;
        font-size: 1.4rem;
        line-height: 1.8;
        counter-increment: koji;
    }

.c-page-product__koji-li::before {
            content: counter(koji);
            position: absolute;
            top: 4px;
            left: 0;
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 22px;
            height: 22px;
            font-size: 1.2rem;
            font-weight: 700;
            color: var(--color-lightest);
            border-radius: 50%;
        }

.c-page-product__koji-li strong {
            color: var(--color-red);
        }

/* C: コスト比較。PC: 3 列グリッド（行揃えは subgrid）+ 右列は浮き出し TMR カード / SP: TMR カード 1 本 */

.c-page-product__tmr-cost {
        margin-top: 72px;
    }

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

.c-page-product__tmr-cost {
            margin-top: 56px
    }
        }

.c-page-product__tcost {
        position: relative;
        max-width: 960px;
        margin: 40px auto 0;
        padding: 30px 24px 14px 0; /* 浮き出しカード・バッジ・吹き出しの分 */
    }

.c-page-product__tcost-grid {
        display: grid;
        grid-template-columns: minmax(170px, 230px) minmax(0, 1fr) minmax(0, 1.6fr);
        grid-template-rows: auto repeat(4, minmax(0, auto));
        background: var(--color-lightest);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card-soft);
                box-shadow: var(--shadow-card-soft);
    }

.c-page-product__tcost-corner {
        grid-column: 1;
        grid-row: 1;
        background: var(--color-pale-01);
        border-radius: var(--radius-card-lg) 0 0 0;
    }

.c-page-product__tcost-head {
        grid-column: 2;
        grid-row: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        padding: 20px 16px;
        font-size: 2rem;
        font-weight: 700;
        text-align: center;
        color: var(--color-lightest);
        background: var(--color-gray-head);
    }

.c-page-product__tcost-label {
        grid-column: 1;
        grid-row: var(--row);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 12px;
        padding: 18px 20px;
        background: var(--color-pale-01);
        border-top: 1px solid var(--color-border-01);
    }

.c-page-product__tcost-label img {
            width: 44px;
            height: 44px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__tcost-label > div {
            min-width: 0;
        }

.c-page-product__tcost-label:last-of-type {
            border-radius: 0 0 0 var(--radius-card-lg);
        }

.c-page-product__tcost-k {
        display: block;
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.3;
        color: var(--color-primary);
    }

.c-page-product__tcost-ksub {
        display: block;
        margin-top: 2px;
        font-size: 1.2rem;
        color: var(--color-gray-text);
    }

.c-page-product__tcost-direct {
        grid-column: 2;
        grid-row: var(--row);
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        padding: 18px 20px;
        font-size: 1.7rem;
        text-align: center;
        color: var(--color-gray-text);
        border-top: 1px solid var(--color-border-01);
        border-left: 1px solid var(--color-border-01);
    }

.c-page-product__tcost-tmr {
        position: relative;
        z-index: 1;
        grid-column: 3;
        grid-row: 1 / -1;
        display: grid;
        grid-template-rows: subgrid;
        margin: -14px -14px -14px 0;
        background: var(--color-cream-03);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-cost-card);
                box-shadow: var(--shadow-cost-card);
    }

.c-page-product__tcost-tmr-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 4px;
        padding: 20px 16px;
        text-align: center;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-card-lg) var(--radius-card-lg) 0 0;
    }

.c-page-product__tcost-tmr-head span {
            font-size: 2.6rem;
            font-weight: 900;
            letter-spacing: .04em;
        }

.c-page-product__tcost-tmr-head small {
            font-size: 1.2rem;
            font-weight: 700;
            opacity: .9;
        }

.c-page-product__tcost-tmr-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 18px 20px;
        border-top: 1px solid var(--color-cream-line);
    }

.c-page-product__tcost-tmr-row img {
            width: 56px;
            height: 56px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__tcost-tmr-body {
        -webkit-box-flex: 0;
            -ms-flex: 0 1 auto;
                flex: 0 1 auto; /* 吹き出しを値の直後に置くため伸ばさない */
        min-width: 0;
    }

.c-page-product__tcost-v {
        display: block;
        font-size: 2rem;
        font-weight: 900;
        line-height: 1.3;
        letter-spacing: .02em;
        color: var(--color-red);
    }

.c-page-product__tcost-v--big {
            font-size: 3.4rem;
        }

.c-page-product__tcost-vsub {
        display: block;
        margin-top: 4px;
        font-size: 1.3rem;
        line-height: 1.6;
    }

.c-page-product__tcost-bubble {
        position: relative;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        margin-left: 6px;
        padding: 8px 16px;
        font-size: 1.3rem;
        font-weight: 700;
        line-height: 1.4;
        text-align: center;
        color: var(--color-red);
        background: var(--color-lightest);
        border: 2px solid var(--color-red);
        border-radius: var(--radius-pill);
    }

.c-page-product__tcost-bubble::before {
            content: "";
            position: absolute;
            top: 50%;
            left: -9px;
            border-top: 7px solid transparent;
            border-bottom: 7px solid transparent;
            border-right: 9px solid var(--color-red);
            -webkit-transform: translateY(-50%);
                    transform: translateY(-50%);
        }

/* SP: 値の下のピル（三角なし） */

.c-page-product__tcost-bubble--sp {
            display: inline-block;
            margin-top: 6px;
            padding: 3px 10px;
            font-size: 1.1rem;
            border-width: 1.5px;
        }

.c-page-product__tcost-bubble--sp::before {
                display: none;
            }

.c-page-product__tcost-badge {
        position: absolute;
        top: -30px;
        right: -22px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 2px;
        width: 104px;
        height: 104px;
        line-height: 1.2;
        text-align: center;
        color: var(--color-lightest);
        background: var(--color-red);
        border: 3px solid var(--color-lightest);
        border-radius: 50%;
        -webkit-box-shadow: var(--shadow-badge-red);
                box-shadow: var(--shadow-badge-red);
    }

.c-page-product__tcost-badge img {
            width: 26px;
            height: auto;
        }

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

.c-page-product__tcost-badge {
            top: -18px;
            right: 12px;
            gap: 1px;
            width: 80px;
            height: 80px
    }
            .c-page-product__tcost-badge img {
                width: 20px;
            }
        }

.c-page-product__tcost-badge-label {
        margin-top: 2px;
        font-size: 1.1rem;
        font-weight: 700;
    }

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

.c-page-product__tcost-badge-label {
            margin-top: 1px;
            font-size: .9rem
    }
        }

.c-page-product__tcost-badge-mark {
        font-size: 1.8rem;
        font-weight: 900;
        line-height: 1;
    }

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

.c-page-product__tcost-badge-mark {
            font-size: 1.5rem
    }
        }

/* SP: TMR カード 1 本（直接給与の値はチップで併記） */

.c-page-product__tcost-sp {
        position: relative;
        margin-top: 36px;
        padding-top: 18px;
    }

.c-page-product__tcost-card {
        position: relative;
        background: var(--color-cream-03);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-cost-card-sp);
                box-shadow: var(--shadow-cost-card-sp);
    }

.c-page-product__tcost-card .c-page-product__tcost-tmr-head {
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            gap: 2px;
            padding: 16px 90px 14px 16px;
            text-align: left;
        }

.c-page-product__tcost-card .c-page-product__tcost-tmr-head span {
                font-size: 2rem;
            }

.c-page-product__tcost-sp-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 12px;
        padding: 14px 16px;
        border-top: 1px solid var(--color-cream-line);
    }

.c-page-product__tcost-sp-row > img {
            width: 40px;
            height: 40px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            margin-top: 2px;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__tcost-sp-row .c-page-product__tcost-v {
            margin-top: 4px;
            font-size: 1.7rem;
        }

.c-page-product__tcost-sp-row .c-page-product__tcost-v--big {
                font-size: 2.8rem;
            }

.c-page-product__tcost-sp-row .c-page-product__tcost-vsub {
            margin-top: 3px;
            font-size: 1.2rem;
        }

.c-page-product__tcost-sp-body {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        min-width: 0;
    }

.c-page-product__tcost-sp-meta {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        font-size: 1.2rem;
        color: var(--color-gray-text);
    }

.c-page-product__tcost-sp-meta img {
            width: 16px;
            height: 16px;
            -o-object-fit: contain;
               object-fit: contain;
        }

.c-page-product__tcost-sp-meta strong {
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-product__tcost-chip {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 6px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content;
        margin-top: 8px;
        padding: 4px 10px;
        font-size: 1.2rem;
        color: var(--color-gray-text);
        background: var(--color-gray-chip);
        border-radius: var(--radius-btn);
    }

.c-page-product__tcost-chip strong {
            font-weight: 700;
            color: var(--color-text-sub);
        }

.c-page-product__tmr-note {
        margin-top: 12px;
        font-size: 1.3rem;
        text-align: center;
        color: var(--color-text-sub);
    }

/* D: 効果ポイント（2 列カード） */

.c-page-product__tmr-points {
        margin-top: 72px;
    }

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

.c-page-product__tmr-points {
            margin-top: 56px
    }
        }

.c-page-product__tmr-list {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
        gap: 16px;
        margin-top: 28px;
    }

.c-page-product__tmr-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 18px;
        padding: 18px 22px;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__tmr-row img {
            width: 64px;
            height: 64px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

.c-page-product__tmr-row .c-page-product__tmr-divider {
            -ms-flex-item-align: stretch;
                align-self: stretch;
            width: 1px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            background: var(--color-border-04);
        }

.c-page-product__tmr-text {
        min-width: 0;
    }

.c-page-product__tmr-text p {
            font-size: 1.5rem;
            line-height: 1.7;
            letter-spacing: .04em;
        }

.c-page-product__tmr-text strong {
            font-size: 1.7rem;
            font-weight: 700;
            color: var(--color-red);
        }

.c-page-product__tmr-effect {
        margin-top: 4px;
    }

/* ---------- M2: USAGE ---------- */

.c-page-product__usage .c-section__bg img {
        -o-object-position: center bottom;
           object-position: center bottom;
    }

.c-page-product__usage .c-section__bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, .85)), color-stop(30%, rgba(255, 255, 255, .75)), color-stop(60%, rgba(255, 255, 255, .45)), to(rgba(255, 255, 255, .15)));
        background: linear-gradient(180deg, rgba(255, 255, 255, .85) 0%, rgba(255, 255, 255, .75) 30%, rgba(255, 255, 255, .45) 60%, rgba(255, 255, 255, .15) 100%);
    }

.c-page-product__stage {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-product__stage-head {
        position: relative;
        height: 150px;
        overflow: hidden;
        background: var(--color-primary);
    }

.c-page-product__stage-head img {
            position: absolute;
            right: 0;
            top: 0;
            width: 58%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: center 35%;
               object-position: center 35%;
            -webkit-transform: scale(1.35);
                    transform: scale(1.35);
            -webkit-transform-origin: 0% 35%;
                    transform-origin: 0% 35%;
        }

.c-page-product__stage-head::after {
            content: "";
            position: absolute;
            inset: 0;
            background: -webkit-gradient(linear, left top, right top, from(#1F7A34), color-stop(40%, #1F7A34), color-stop(46%, rgba(31, 122, 52, .97)), color-stop(54%, rgba(31, 122, 52, .8)), color-stop(63%, rgba(31, 122, 52, .45)), color-stop(72%, rgba(31, 122, 52, .12)), color-stop(80%, rgba(31, 122, 52, 0)));
            background: linear-gradient(90deg, #1F7A34 0%, #1F7A34 40%, rgba(31, 122, 52, .97) 46%, rgba(31, 122, 52, .8) 54%, rgba(31, 122, 52, .45) 63%, rgba(31, 122, 52, .12) 72%, rgba(31, 122, 52, 0) 80%);
        }

.c-page-product__stage-head .c-page-product__stage-label {
            position: relative;
            z-index: 1;
            padding: 28px 28px 0;
            color: var(--color-lightest);
        }

.c-page-product__stage-head .c-page-product__stage-name {
            display: block;
            font-size: 2.4rem;
            font-weight: 700;
            line-height: 1.3;
        }

.c-page-product__stage-head .c-page-product__stage-en {
            display: block;
            margin-top: 6px;
            font-family: var(--font-family-en);
            font-size: 1.3rem;
            font-weight: 700;
            letter-spacing: .12em;
            opacity: .9;
        }

.c-page-product__stage-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        padding: 26px 28px 30px;
    }

.c-page-product__stage-body > ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 12px;
        }

.c-page-product__stage-body > ul li {
                display: -webkit-box;
                display: -ms-flexbox;
                display: flex;
                gap: 12px;
                font-size: 1.5rem;
                line-height: 1.8;
                letter-spacing: .04em;
            }

.c-page-product__stage-body > ul li::before {
                    content: "✓";
                    display: -webkit-box;
                    display: -ms-flexbox;
                    display: flex;
                    -webkit-box-align: center;
                        -ms-flex-align: center;
                            align-items: center;
                    -webkit-box-pack: center;
                        -ms-flex-pack: center;
                            justify-content: center;
                    width: 22px;
                    height: 22px;
                    -webkit-box-flex: 0;
                        -ms-flex: none;
                            flex: none;
                    margin-top: 4px;
                    font-size: 1.2rem;
                    line-height: normal;
                    letter-spacing: 0;
                    color: var(--color-lightest);
                    background: var(--color-accent);
                    border-radius: 50%;
                }

/* 使用方法: 22px 余白 → 区切り線 → 22px 余白 → アイコン + 本文 */

.c-page-product__stage-how {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 22px 16px;
        margin-top: auto;
        padding-top: 22px;
    }

.c-page-product__stage-how::before {
            content: "";
            -webkit-box-flex: 0;
                -ms-flex: 0 0 100%;
                    flex: 0 0 100%;
            height: 1px;
            background: var(--color-border-01);
        }

.c-page-product__stage-how .c-page-product__stage-how-icon {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: center;
                -ms-flex-align: center;
                    align-items: center;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            width: 52px;
            height: 52px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            background: var(--color-primary);
            border-radius: 50%;
        }

.c-page-product__stage-how .c-page-product__stage-how-icon svg {
                width: 26px;
                height: 26px;
            }

.c-page-product__stage-how > div {
            -webkit-box-flex: 1;
                -ms-flex: 1;
                    flex: 1;
            min-width: 0;
        }

.c-page-product__stage-how .c-page-product__stage-how-title {
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-product__stage-how .c-page-product__stage-how-list {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 4px;
            margin-top: 6px;
        }

.c-page-product__stage-how .c-page-product__stage-how-list li {
                font-size: 1.4rem;
                line-height: 1.8;
            }

/* ---------- M2・MC: MOVIE ---------- */

.c-page-product__movie {
        background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#F6FAF1));
        background: linear-gradient(180deg, #fff 0%, #F6FAF1 100%);
    }

/* 本数が少なくても 1 枚が 3 列分の幅を超えないよう上限を付けて中央寄せ（gap28 × 2） */

.c-page-product__movie .c-grid {
            grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), calc((100% - 56px) / 3)));
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }

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

.c-page-product__movie .c-grid {
                grid-template-columns: 1fr
        }
            }

.c-page-product__movie::after {
            content: "";
            position: absolute;
            right: -12%;
            bottom: -30%;
            z-index: -1;
            width: 60%;
            height: 80%;
            background: radial-gradient(closest-side, rgba(210, 232, 190, .7), rgba(210, 232, 190, 0));
            border-radius: 50%;
            pointer-events: none;
        }

.c-page-product__movie .c-leaf {
            --leaf-w: min(24%, 340px);
            --leaf-x: -20px;
            --leaf-y: -40px;
            /* 上下反転するため、マスクの向きも反転（下端のセクション端でフェード） */
            --_dir: 180deg;
            -webkit-transform: scaleY(-1);
                    transform: scaleY(-1);
        }

/* SPEC 背景（MC: 上下 2 枚 / M2: 1 枚 cover center top） */
.c-page-product__spec-top {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: -1;
    width: 100%;
    height: auto;
    pointer-events: none;
}
.c-page-product__spec-full {
    -o-object-position: center top;
       object-position: center top;
}
.c-btn--pdf-arrow::after {
    content: "→";
    margin-left: 6px;
}
.c-page-product__spec-pdf:has(.c-btn--strong) {
    margin-top: 32px;
}

/* M2 の PROBLEMS カードはデザインの影が標準（MC・腸菌力シリーズは弱め） */
.c-page-chokinriki-m2 .c-card--problem {
    -webkit-box-shadow: var(--shadow-card);
            box-shadow: var(--shadow-card);
}

/* M2: SOLUTION + IGF-1 を包む共通背景ラッパー */
.c-page-product__wrap {
    position: relative;
    overflow: hidden;
    isolation: isolate;
    background: var(--color-lightest);
}
.c-page-product__wrap .c-page-product__wrap-bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(8%, rgba(255, 255, 255, .95)), color-stop(25%, rgba(255, 255, 255, .7)), color-stop(50%, rgba(255, 255, 255, .35)), color-stop(80%, rgba(255, 255, 255, .3)), to(rgba(255, 255, 255, .55)));
        background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .95) 8%, rgba(255, 255, 255, .7) 25%, rgba(255, 255, 255, .35) 50%, rgba(255, 255, 255, .3) 80%, rgba(255, 255, 255, .55) 100%);
    }
.c-section--transparent {
    background: transparent !important;
}
.c-section--transparent.c-page-product__solution .c-section__bg {
    display: none;
}

/* TECHNOLOGY pillar: 番号・タイトル左 / 画像 150px 右 / 本文は全幅 */
.c-page-product .c-page-product__pillar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 150px;
    grid-template-areas:
        "no img"
        "title img"
        "text text";
    grid-template-rows: auto 1fr auto;
    -webkit-column-gap: 16px;
       -moz-column-gap: 16px;
            column-gap: 16px;
    row-gap: 0;
}
.c-page-product .c-page-product__pillar .c-page-product__pillar-no {
        grid-area: no;
    }
.c-page-product .c-page-product__pillar .c-page-product__pillar-title {
        grid-area: title;
        align-self: start;
        margin-top: 14px;
    }
.c-page-product .c-page-product__pillar .c-page-product__pillar-img {
        grid-area: img;
    }
.c-page-product .c-page-product__pillar .c-page-product__pillar-text {
        grid-area: text;
        margin-top: 16px;
    }

/* M2 TMR マーキー: トラックは同じ 4 枚を 2 周並べるので -50% で継ぎ目なく無限ループ */
@-webkit-keyframes c-tmr-marquee {
    from {
        -webkit-transform: translateX(0);
                transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
    }
}
@keyframes c-tmr-marquee {
    from {
        -webkit-transform: translateX(0);
                transform: translateX(0);
    }
    to {
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
    }
}

@media (prefers-reduced-motion: reduce) {
    .c-page-product__tmr-track {
        -webkit-animation: none;
                animation: none;
    }
    .c-page-product__tmr-marquee {
        overflow-x: auto;
    }
}

/* ===================================================================
  CSS information
  file name  :  c-page-business.css
  事業・製品 / 畜産・農業資材 / 石灰・採石事業
=================================================================== */

/* SP もデザインは PC と同値 */

.c-page-business__segments-lead {
        max-width: 820px;
        margin: 18px auto 0;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        text-align: center;
    }

.c-page-business__segments-lead a {
            font-weight: 700;
        }

/* ---------- SEGMENTS（事業・製品） ---------- */

.c-page-business__segment-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 32px;
        margin-top: 44px;
    }

.c-page-business__segment {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
        overflow: hidden;
        background: var(--color-lightest);
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-business__segment-media {
        position: relative;
        min-height: 260px;
    }

.c-page-business__segment-media img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: var(--card-pos, center);
               object-position: var(--card-pos, center);
        }

.c-page-business__segment-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        padding: 36px 40px;
    }

.c-page-business__segment-body h3 {
            font-size: 2.6rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-business__segment-desc {
        margin-top: 14px;
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
    }

.c-page-business__segment-note {
        margin-top: 12px;
        font-size: 1.4rem;
        line-height: 1.8;
        color: var(--color-text-sub);
    }

.c-page-business__segment-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin-top: auto;
        padding-top: 24px;
    }

/* ---------- OVERVIEW（アーチ形状の内側に写真 + 白グラデ） ---------- */

.c-page-business__overview-bg img {
            position: absolute;
            right: 6%;
            bottom: 0;
            width: min(62%, 1100px);
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: right bottom;
               object-position: right bottom;
            /* 写真は最大幅で止まるため、広い画面では左端が白フェード（% 指定）の外に出て縦の切れ目になる。写真自体の左端もフェードさせる */
            -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, #000));
            -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 30%);
            mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(30%, #000));
            mask-image: linear-gradient(90deg, transparent 0%, #000 30%);
        }

.c-page-business__overview-bg::before,
        .c-page-business__overview-bg::after {
            content: "";
            position: absolute;
            inset: 0;
            z-index: 1;
        }

/* 白のフェードは写真より上に重ねる（z-index 未指定だと ::before が img の下に描画され、左端がぼけない） */

.c-page-business__overview-bg::before {
            background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(40%, #fff), color-stop(52%, rgba(255, 255, 255, .85)), color-stop(66%, rgba(255, 255, 255, .4)), color-stop(82%, rgba(255, 255, 255, 0)));
            background: linear-gradient(90deg, #fff 0%, #fff 40%, rgba(255, 255, 255, .85) 52%, rgba(255, 255, 255, .4) 66%, rgba(255, 255, 255, 0) 82%);
        }

.c-page-business__overview-bg::after {
            background: -webkit-gradient(linear, left top, left bottom, from(#fff), color-stop(25%, rgba(255, 255, 255, .7)), color-stop(60%, rgba(255, 255, 255, 0)));
            background: linear-gradient(180deg, #fff 0%, rgba(255, 255, 255, .7) 25%, rgba(255, 255, 255, 0) 60%);
        }

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

.c-page-business__overview--cows .c-page-business__overview-bg img {
            opacity: .3
    }
        }

.c-page-business__overview--quarry .c-page-business__overview-bg img {
            width: min(58%, 1000px);
            -o-object-position: center;
               object-position: center;
        }

.c-page-business__overview--quarry .c-page-business__overview-bg::before {
            background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(42%, #fff), color-stop(54%, rgba(255, 255, 255, .85)), color-stop(68%, rgba(255, 255, 255, .4)), color-stop(84%, rgba(255, 255, 255, 0)));
            background: linear-gradient(90deg, #fff 0%, #fff 42%, rgba(255, 255, 255, .85) 54%, rgba(255, 255, 255, .4) 68%, rgba(255, 255, 255, 0) 84%);
        }

.c-page-business__overview-text {
        position: relative;
        max-width: 620px;
        margin-top: 28px;
    }

.c-page-business__overview-text p {
            font-size: 1.6rem;
            line-height: 2;
            letter-spacing: .04em;
        }

.c-page-business__overview-text p + p {
                margin-top: 16px;
            }

/* ---------- PRODUCTS（畜産・農業資材） ---------- */

.c-page-business__product .c-card__media {
            height: 200px;
            background: var(--color-lightest);
        }

.c-page-business__product .c-card__body {
            gap: 10px;
        }

.c-page-business__product .c-card__title {
            font-size: 1.8rem;
            line-height: 1.6;
            word-break: normal;
        }

.c-page-business__product .c-card__text {
            margin-top: 0;
            letter-spacing: .04em;
        }

.c-page-business__product .c-card__btn {
            padding-top: 0;
        }

/* ---------- CATALOG ---------- */

.c-page-business__catalog-bg {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        z-index: -1;
        width: 100%;
        height: auto;
        -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(78%, rgba(0, 0, 0, .4)), to(transparent));
        -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 50%, rgba(0, 0, 0, .4) 78%, transparent 100%);
        mask-image: -webkit-gradient(linear, left top, left bottom, from(#000), color-stop(50%, #000), color-stop(78%, rgba(0, 0, 0, .4)), to(transparent));
        mask-image: linear-gradient(180deg, #000 0%, #000 50%, rgba(0, 0, 0, .4) 78%, transparent 100%);
        pointer-events: none;
    }

.c-page-business__catalog-col {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 32px;
    }

.c-page-business__catalog-card {
        padding: 32px;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-business__catalog-card h3 {
            margin-bottom: 16px;
            padding-bottom: 10px;
            font-size: 1.9rem;
            font-weight: 700;
            color: var(--color-primary);
            border-bottom: 2px solid var(--color-accent);
        }

.c-page-business__catalog-card ul {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 12px;
        }

.c-page-business__catalog-card ul li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            gap: 12px;
            font-size: 1.5rem;
            line-height: 1.9;
        }

.c-page-business__catalog-card ul li::before {
                content: "";
                width: 8px;
                height: 8px;
                -webkit-box-flex: 0;
                    -ms-flex: none;
                        flex: none;
                margin-top: 9px;
                background: var(--color-accent);
                border-radius: 50%;
            }

/* 畜産用の効能（番号付き）+ 腸菌力シリーズとの併用提案 */

.c-page-business__points {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 12px;
    }

.c-page-business__points ol {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 12px;
        }

.c-page-business__points li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            gap: 14px;
        }

.c-page-business__points li > div {
                min-width: 0;
            }

.c-page-business__points-no {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 32px;
        height: 32px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        font-family: var(--font-family-en);
        font-size: 1.5rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-primary);
        border-radius: var(--radius-pill);
    }

.c-page-business__points-t {
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.6;
        color: var(--color-primary);
    }

.c-page-business__points-b {
        margin-top: 4px;
        font-size: 1.5rem;
        line-height: 1.9;
    }

.c-page-business__points-note {
        margin-top: 6px;
        padding: 14px 18px;
        font-size: 1.4rem;
        line-height: 1.9;
        background: var(--color-pale-01);
        border-radius: var(--radius-box);
    }

.c-page-business__points-note a {
            font-weight: 700;
            color: var(--color-primary);
            text-decoration: underline;
        }

.c-page-business__comp-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 11px 0;
        border-bottom: 1px solid var(--color-border-03);
        font-size: 1.5rem;
    }

.c-page-business__comp-k {
        width: 130px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
    }

.c-page-business__comp-bar {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        height: 8px;
        overflow: hidden;
        background: var(--color-border-03);
        border-radius: var(--radius-pill);
    }

.c-page-business__comp-bar span {
            display: block;
            height: 100%;
            background: var(--color-primary);
            border-radius: var(--radius-pill);
        }

.c-page-business__comp-v {
        width: 64px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        font-family: var(--font-family-en);
        font-weight: 700;
        color: var(--color-primary);
        text-align: right;
    }

/* ---------- SCENE ---------- */

.c-page-business__scene .c-section__bg img {
        -o-object-position: center bottom;
           object-position: center bottom;
        opacity: .55;
    }

.c-page-business__scene .c-section__bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(243, 247, 238, .95)), color-stop(30%, rgba(243, 247, 238, .6)), color-stop(60%, rgba(243, 247, 238, .35)), to(rgba(243, 247, 238, .75)));
        background: linear-gradient(180deg, rgba(243, 247, 238, .95) 0%, rgba(243, 247, 238, .6) 30%, rgba(243, 247, 238, .35) 60%, rgba(243, 247, 238, .75) 100%);
    }

.c-page-business__scene-card {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-business__scene-media {
        position: relative;
        height: 150px;
    }

.c-page-business__scene-media > img:first-child {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-page-business__scene-icon {
        position: absolute;
        left: 20px;
        bottom: -34px;
        width: 84px;
        height: 84px;
        background: var(--color-lightest);
        border-radius: 50%;
        -webkit-box-shadow: var(--shadow-icon);
                box-shadow: var(--shadow-icon);
    }

.c-page-business__scene-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 10px;
        padding: 48px 24px 26px;
    }

.c-page-business__scene-body h4 {
            font-size: 1.8rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-business__scene-body p {
            font-size: 1.4rem;
            line-height: 1.9;
        }

/* ---------- FLOW & RECORDS（石灰・採石） ---------- */

.c-page-business__flow .c-section__bg img {
        -o-object-position: left top;
           object-position: left top;
        opacity: .7;
    }

/* PC: 石灰石（2 行跨ぎ）| 矢印 | 製品 | 矢印 | 納入先 × 2 行。行ラッパーは display:contents */

.c-page-business__flow-grid {
        display: grid;
        grid-template-columns: minmax(130px, .9fr) clamp(40px, 5vw, 90px) minmax(150px, .9fr) clamp(22px, 2.6vw, 44px) minmax(260px, 1.7fr);
        grid-template-rows: auto auto;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 24px clamp(6px, 1vw, 12px);
        margin-top: 40px;
        padding: clamp(24px, 2.6vw, 36px) clamp(20px, 2.4vw, 36px);
        background: var(--color-white-a90);
        border-radius: var(--radius-card-xl);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

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

.c-page-business__flow-grid {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 12px;
            margin-top: 32px;
            padding: 0;
            background: none;
            border-radius: 0;
            -webkit-box-shadow: none;
                    box-shadow: none
    }
        }

.c-page-business__flow-source {
        position: relative;
        grid-row: 1 / span 2;
        align-self: stretch;
        min-height: 420px;
        overflow: hidden;
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-photo);
                box-shadow: var(--shadow-photo);
        color: var(--color-lightest);
        text-align: center;
    }

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

.c-page-business__flow-source {
            height: 240px;
            min-height: 0
    }
        }

.c-page-business__flow-source::after {
            content: "";
            position: absolute;
            inset: 0;
            background: var(--gradient-ls-rocks);
        }

.c-page-business__flow-source-img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: center 60%;
           object-position: center 60%;
    }

.c-page-business__flow-source-body {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        padding: 0 18px 28px;
    }

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

.c-page-business__flow-source-body {
            padding-bottom: 18px
    }
        }

.c-page-business__flow-source-name {
        font-size: 2.8rem;
        font-weight: 900;
        letter-spacing: .08em;
        text-shadow: var(--shadow-text-photo);
    }

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

.c-page-business__flow-source-name {
            font-size: 2.4rem
    }
        }

.c-page-business__flow-source-sub {
        margin-top: 4px;
        font-size: 1.4rem;
        font-weight: 700;
    }

.c-page-business__flow-supplier {
        max-width: 240px;
        margin: 14px auto 0;
        padding-top: 12px;
        border-top: 1px solid var(--color-white-a50);
    }

.c-page-business__flow-supplier-label {
        font-size: 1.2rem;
        opacity: .9;
    }

.c-page-business__flow-supplier-name {
        margin-top: 2px;
        font-size: 1.5rem;
        font-weight: 900;
        line-height: 1.5;
    }

.c-page-business__flow-row {
        --flow-color: var(--color-primary);
        --flow-dot: var(--gradient-dot-green);
        --flow-grad: var(--gradient-ls-green);
        display: contents;
    }

.c-page-business__flow-row--red {
            --flow-color: var(--color-red);
            --flow-dot: var(--gradient-dot-red);
            --flow-grad: var(--gradient-ls-red);
        }

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

.c-page-business__flow-row {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            gap: 10px;
            padding: 14px;
            background: var(--color-white-a92);
            border-radius: var(--radius-card)
    }
        }

/* 矢印（PC: 工程名の下に →。SP: 工程名の右に ↓） */

.c-page-business__flow-arrow {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 4px;
        color: var(--color-red);
    }

.c-page-business__flow-arrow::after {
            content: "→";
            font-size: 2.8rem;
            font-weight: 700;
            line-height: 1;
        }

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

.c-page-business__flow-arrow {
            -webkit-box-orient: horizontal;
            -webkit-box-direction: normal;
                -ms-flex-direction: row;
                    flex-direction: row;
            gap: 8px
    }
            .c-page-business__flow-arrow::after {
                content: "↓";
                font-size: 2.4rem;
            }
        }

.c-page-business__flow-process {
        font-size: 1.9rem;
        font-weight: 900;
        white-space: nowrap;
    }

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

.c-page-business__flow-process {
            font-size: 1.5rem
    }
        }

.c-page-business__flow-product {
        position: relative;
        padding-top: 34px;
    }

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

.c-page-business__flow-product {
            padding-top: 30px
    }
        }

.c-page-business__flow-icon {
        position: absolute;
        top: 0;
        left: 50%;
        z-index: 2;
        width: 72px;
        height: 72px;
        border-radius: var(--radius-pill);
        -webkit-box-shadow: var(--shadow-icon);
                box-shadow: var(--shadow-icon);
        -webkit-transform: translateX(-50%);
                transform: translateX(-50%);
    }

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

.c-page-business__flow-icon {
            width: 60px;
            height: 60px
    }
        }

.c-page-business__flow-photo {
        position: relative;
        height: 176px;
        overflow: hidden;
        border-radius: var(--radius-qa);
        -webkit-box-shadow: var(--shadow-photo);
                box-shadow: var(--shadow-photo);
        color: var(--color-lightest);
        text-align: center;
    }

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

.c-page-business__flow-photo {
            height: 150px
    }
        }

.c-page-business__flow-photo img {
            position: absolute;
            inset: 0;
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-page-business__flow-photo::after {
            content: "";
            position: absolute;
            inset: 0;
            background: var(--flow-grad);
        }

.c-page-business__flow-photo-body {
        position: absolute;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 1;
        padding: 0 12px 20px;
    }

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

.c-page-business__flow-photo-body {
            padding-bottom: 16px
    }
        }

.c-page-business__flow-name {
        font-size: 2.6rem;
        font-weight: 900;
        line-height: 1.3;
        letter-spacing: .06em;
        text-shadow: var(--shadow-text-photo-weak);
    }

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

.c-page-business__flow-name {
            font-size: 2.2rem
    }
        }

.c-page-business__flow-use {
        margin-top: 6px;
        font-size: 1.3rem;
        font-weight: 700;
        line-height: 1.5;
    }

.c-page-business__flow-dest {
        -ms-flex-item-align: stretch;
            align-self: stretch;
        padding-top: 34px;
    }

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

.c-page-business__flow-dest {
            padding-top: 0
    }
        }

/* PC: 左に文字・右に写真（左から透明）。写真幅は狭い画面で 0 になり非表示 */

.c-page-business__flow-dest-card {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        min-height: 100%;
        overflow: hidden;
        background: var(--color-lightest);
        border: 2px solid var(--flow-color);
        border-radius: var(--radius-qa);
    }

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

.c-page-business__flow-dest-card {
            position: relative;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            min-height: 0
    }
        }

.c-page-business__flow-dest-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
            -ms-flex: 1 1 0px;
                flex: 1 1 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        min-width: 0;
        padding: 20px 22px;
    }

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

.c-page-business__flow-dest-body {
            position: relative;
            z-index: 1;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
            padding: 96px 18px 18px
    }
        }

.c-page-business__flow-dest-label {
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--flow-color);
    }

.c-page-business__flow-clients {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 6px;
        margin-top: 10px;
    }

.c-page-business__flow-clients li {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-align: start;
                -ms-flex-align: start;
                    align-items: flex-start;
            gap: 10px;
            font-size: clamp(17px, 1.7vw, 24px);
            font-weight: 900;
            line-height: 1.5;
            letter-spacing: .02em;
            color: var(--flow-color);
            word-break: keep-all;
            overflow-wrap: anywhere;
        }

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

.c-page-business__flow-clients li {
                font-size: 1.7rem
        }
            }

.c-page-business__flow-clients li::before {
                content: "";
                width: 12px;
                height: 12px;
                -webkit-box-flex: 0;
                    -ms-flex: none;
                        flex: none;
                margin-top: .45em;
                border-radius: var(--radius-pill);
                background: var(--flow-dot);
            }

.c-page-business__flow-dest-note {
        margin: 8px 0 0 22px;
        font-size: 1.3rem;
        line-height: 1.7;
        color: var(--color-text-sub);
    }

.c-page-business__flow-dest-photo {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 clamp(0px, calc(100% - 300px), 44%);
                flex: 0 0 clamp(0px, calc(100% - 300px), 44%);
        min-width: 0;
        background-position: var(--bg-pos, center);
        background-size: cover;
        background-repeat: no-repeat;
        -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(45%, #000));
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 45%);
        mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(45%, #000));
        mask-image: linear-gradient(90deg, transparent 0%, #000 45%);
    }

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

.c-page-business__flow-dest-photo {
            position: absolute;
            top: 0;
            right: 0;
            left: 0;
            height: 120px;
            opacity: .9;
            -webkit-mask-image: -webkit-gradient(linear, left bottom, left top, from(transparent), color-stop(60%, #000));
            -webkit-mask-image: linear-gradient(0deg, transparent 0%, #000 60%);
            mask-image: -webkit-gradient(linear, left bottom, left top, from(transparent), color-stop(60%, #000));
            mask-image: linear-gradient(0deg, transparent 0%, #000 60%)
    }
        }

/* ---------- ITEMS（石灰・採石） ---------- */

.c-page-business__items .c-section__bg img {
        -o-object-position: right top;
           object-position: right top;
        opacity: .55;
    }

.c-page-business__items-grid {
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        gap: 28px;
    }

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

.c-page-business__items-grid {
            gap: 20px
    }
        }

.c-page-business__item {
        --item-color: var(--color-primary);
        --item-name: var(--color-primary);
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        overflow: hidden;
        background: var(--color-lightest);
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-business__item--red {
            --item-color: var(--color-red);
        }

.c-page-business__item--accent {
            --item-color: var(--color-accent);
        }

.c-page-business__item--name-red {
            --item-name: var(--color-red);
        }

.c-page-business__item-media {
        position: relative;
        height: 200px;
    }

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

.c-page-business__item-media {
            height: 170px
    }
        }

.c-page-business__item-photo {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
    }

.c-page-business__item-icon {
        position: absolute;
        top: 18px;
        left: 22px;
        width: 80px;
        height: 80px;
        border-radius: var(--radius-pill);
        -webkit-box-shadow: var(--shadow-icon-strong);
                box-shadow: var(--shadow-icon-strong);
    }

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

.c-page-business__item-icon {
            width: 64px;
            height: 64px
    }
        }

/* 白い本体を写真に 22px 重ね、A/B/C のバッジを境目にかける */

.c-page-business__item-body {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 14px;
        margin-top: -22px;
        padding: 24px 28px 30px;
        background: var(--color-lightest);
        border-radius: var(--radius-sheet) var(--radius-sheet) 0 0;
    }

.c-page-business__item-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 16px;
        margin-top: -6px;
    }

.c-page-business__item-no {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 56px;
        height: 56px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        margin-top: 0;
        font-family: var(--font-family-en);
        font-size: 2.2rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--item-color);
        border: 4px solid var(--color-lightest);
        border-radius: var(--radius-pill);
        -webkit-box-shadow: var(--shadow-badge);
                box-shadow: var(--shadow-badge);
    }

.c-page-business__item-heading {
        min-width: 0;
    }

.c-page-business__item-tag {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 8px;
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-red);
    }

.c-page-business__item-tag::before {
            content: "";
            width: 1px;
            height: 12px;
            background: var(--color-red);
        }

.c-page-business__item-name {
        margin-top: 4px;
        font-size: 2.8rem;
        font-weight: 900;
        line-height: 1.4;
        letter-spacing: .04em;
        color: var(--item-name);
    }

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

.c-page-business__item-name {
            font-size: 2.4rem
    }
        }

.c-page-business__item-text {
        font-size: 1.5rem;
        line-height: 1.9;
        letter-spacing: .04em;
        text-wrap: pretty;
    }

/* ===================================================================
  CSS information
  file name  :  c-page-company.css
  会社案内
=================================================================== */

/* ---------- MESSAGE ---------- */

.c-page-company__message-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
        gap: 48px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
        margin-top: 44px;
    }

/* SP もデザインは PC と同値 */

.c-page-company__message-text h3 {
            font-size: 2.4rem;
            font-weight: 900;
            color: var(--color-primary);
        }

.c-page-company__message-text p {
            margin-top: 18px;
            font-size: 1.6rem;
            line-height: 2.1;
            letter-spacing: .04em;
        }

.c-page-company__message-text p + p {
                margin-top: 20px;
            }

.c-page-company__message-text .c-page-company__message-sign {
            margin-top: 24px;
            font-weight: 700;
            line-height: normal;
            letter-spacing: 0;
            color: var(--color-primary);
        }

.c-page-company__message-photo {
        justify-self: center;
        width: 100%;
        max-width: 400px;
        aspect-ratio: 3 / 4;
        overflow: hidden;
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-company__message-photo img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
            -o-object-position: 50% 30%;
               object-position: 50% 30%;
        }

/* ---------- PROFILE ---------- */

.c-page-company__profile .c-section__bg img {
        opacity: .4;
    }

.c-page-company__profile .c-section__bg::after {
        content: "";
        position: absolute;
        inset: 0;
        background: -webkit-gradient(linear, left top, left bottom, from(rgba(243, 247, 238, .35)), color-stop(40%, rgba(243, 247, 238, 0)), color-stop(80%, rgba(243, 247, 238, 0)), to(rgba(243, 247, 238, .5)));
        background: linear-gradient(180deg, rgba(243, 247, 238, .35) 0%, rgba(243, 247, 238, 0) 40%, rgba(243, 247, 238, 0) 80%, rgba(243, 247, 238, .5) 100%);
    }

/* 事業所行はデザインが行全体 line-height 1.9（見出しセルも含む） */

.c-page-company__offices-row > * {
        line-height: 1.9;
    }

.c-page-company__offices > div + div {
            margin-top: 10px;
        }

.c-page-company__offices strong {
            color: var(--color-primary);
        }

/* ---------- HISTORY ---------- */

.c-page-company__history-bg {
        position: absolute;
        right: 0;
        bottom: 0;
        z-index: -1;
        width: min(60%, 900px);
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: right bottom;
           object-position: right bottom;
        opacity: .45;
        -webkit-mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(40%, #000)), -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(35%, #000));
        -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 40%), linear-gradient(180deg, transparent 0%, #000 35%);
        mask-image: -webkit-gradient(linear, left top, right top, from(transparent), color-stop(40%, #000)), -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(35%, #000));
        mask-image: linear-gradient(90deg, transparent 0%, #000 40%), linear-gradient(180deg, transparent 0%, #000 35%);
        -webkit-mask-composite: source-in;
        mask-composite: intersect;
        pointer-events: none;
    }

.c-page-company__timeline {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 28px;
        margin-top: 44px;
        padding-left: 34px;
    }

.c-page-company__timeline::before {
            content: "";
            position: absolute;
            left: 0;
            top: 13px;
            bottom: 0;
            width: 2px;
            background: var(--color-accent);
        }

.c-page-company__timeline-item {
        position: relative;
        display: grid;
        grid-template-columns: minmax(120px, 150px) minmax(0, 1fr);
        gap: 20px;
        -webkit-box-align: baseline;
            -ms-flex-align: baseline;
                align-items: baseline;
    }

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

.c-page-company__timeline-item {
            grid-template-columns: 100px minmax(0, 1fr)
    }
        }

.c-page-company__timeline-item::before {
            content: "";
            position: absolute;
            left: -40px;
            top: 6px;
            width: 14px;
            height: 14px;
            background: var(--color-primary);
            border-radius: 50%;
        }

.c-page-company__timeline-year {
        font-size: 1.6rem;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-page-company__timeline-text {
        font-size: 1.6rem;
        line-height: 1.9;
    }

/* ---------- 仕入先・取引先 ---------- */

.c-page-company__sub-title {
        margin-bottom: 20px;
        font-size: 2.2rem;
        font-weight: 900;
        color: var(--color-primary);
    }

/* ---------- ACCESS ---------- */

.c-page-company__access h3 {
            font-size: 1.9rem;
            font-weight: 700;
            color: var(--color-primary);
        }

.c-page-company__access p {
            margin-top: 14px;
            font-size: 1.5rem;
            line-height: 1.9;
        }

.c-page-company__map {
        aspect-ratio: 498 / 374;
        margin-top: 14px;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-company__map iframe {
            display: block;
            width: 100%;
            height: 100%;
            border: 0;
        }

/* ===================================================================
  CSS information
  file name  :  c-page-voice.css
  お客様の声 一覧 / 詳細
=================================================================== */

.c-voice__note--left {
    margin-top: 28px;
    text-align: left;
}

/* ---------- 詳細: 2 カラム ---------- */

.c-page-voice__columns {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
        gap: 44px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
    }

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

.c-page-voice__columns {
            grid-template-columns: minmax(0, 1fr)
    }
        }

.c-page-voice__main {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 32px;
        min-width: 0;
    }

/* Q&A */

.c-page-voice__qa-head {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
    }

.c-page-voice__qa-head h2 {
            font-size: 2.4rem;
            font-weight: 900;
            line-height: 1.5;
            letter-spacing: .04em;
            color: var(--color-primary);
            word-break: auto-phrase;
        }

.c-page-voice__qa-pill {
        display: inline-block;
        padding: 4px 14px;
        font-family: var(--font-family-en);
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .08em;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
    }

/* 牧場紹介（「牧場について」先頭の導入文。Q&A とは別の白カード + 左の緑ライン） */

.c-page-voice__intro {
        position: relative;
        margin-top: 22px;
        padding: 22px 28px 24px 32px;
        background: var(--color-lightest);
        border: 1px solid var(--color-pale-04);
        border-radius: var(--radius-qa);
        overflow: hidden;
    }

.c-page-voice__intro::before {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            left: 0;
            width: 5px;
            background: linear-gradient(180deg, var(--color-accent), var(--color-primary));
        }

.c-page-voice__intro-label + p {
            margin-top: 10px;
        }

.c-page-voice__intro p {
            font-size: 1.6rem;
            line-height: 2;
            letter-spacing: .04em;
        }

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

.c-page-voice__intro {
            padding: 18px 20px 20px 24px
    }
        }

.c-page-voice__intro-label {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 10px;
        font-family: var(--font-family-en);
        font-size: 1.2rem;
        font-weight: 700;
        letter-spacing: .12em;
        color: var(--color-accent);
    }

.c-page-voice__intro-label::after {
            content: "";
            width: 40px;
            height: 1px;
            background: currentcolor;
        }

.c-page-voice__qa-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 14px;
        margin-top: 22px;
    }

.c-page-voice__qa-item {
        padding: 20px 24px;
        background: var(--color-pale-01);
        border-radius: var(--radius-qa);
    }

.c-page-voice__qa-q,
    .c-page-voice__qa-a {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        gap: 14px;
    }

.c-page-voice__qa-q p {
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.7;
        color: var(--color-primary);
    }

.c-page-voice__qa-a {
        margin-top: 12px;
    }

.c-page-voice__qa-a p {
            font-size: 1.6rem;
            line-height: 2;
            letter-spacing: .04em;
        }

.c-page-voice__qa-mark {
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 28px;
        height: 28px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        margin-top: 2px;
        font-family: var(--font-family-en);
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-lightest);
        border-radius: 50%;
    }

.c-page-voice__qa-mark--q {
            background: var(--color-primary);
        }

.c-page-voice__qa-mark--a {
            margin-top: 3px;
            background: var(--color-red);
        }

/* 写真 2 枚 */

.c-page-voice__photos {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr));
        gap: 24px;
    }

.c-page-voice__photos img {
            width: 100%;
            height: 220px;
            -o-object-fit: cover;
               object-fit: cover;
            border-radius: var(--radius-product);
        }

.c-page-voice__photos p {
            display: contents;
        }

.c-page-voice__photos br {
            display: none;
        }

/* サイドバー */

.c-page-voice__side {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 28px;
    }

.c-page-voice__profile {
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-voice__profile-head {
        padding: 14px 24px;
        font-size: 1.6rem;
        font-weight: 700;
        color: var(--color-lightest);
        background: var(--color-primary);
    }

.c-page-voice__profile-photo {
        padding: 20px 24px 0;
    }

.c-page-voice__profile-photo img {
            width: 100%;
            aspect-ratio: 3 / 2;
            height: auto;
            -o-object-fit: cover;
               object-fit: cover;
            border-radius: var(--radius-product);
        }

.c-page-voice__profile-list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 14px;
        padding: 20px 24px 26px;
    }

.c-page-voice__profile-list dt {
            font-size: 1.3rem;
            font-weight: 700;
            color: var(--color-text-sub);
        }

.c-page-voice__profile-list dd {
            margin-top: 2px;
            font-size: 1.5rem;
            word-break: auto-phrase;
        }

/* 使用している製品カード（複数のときは縦に並べる） */

.c-page-voice__products {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 14px;
    }

.c-page-voice__product {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 14px;
        padding: 20px;
        color: inherit;
        background: var(--color-pale-01);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-product);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-page-voice__product:hover {
            color: inherit;
            -webkit-box-shadow: var(--shadow-hover);
                    box-shadow: var(--shadow-hover);
        }

.c-page-voice__product-thumb {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 96px;
        height: 72px;
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        overflow: hidden;
        background: var(--color-lightest);
        border-radius: var(--radius-image);
    }

.c-page-voice__product-thumb img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-page-voice__product-body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 4px;
        min-width: 0;
    }

.c-page-voice__product-label {
        font-size: 1.2rem;
        font-weight: 700;
        color: var(--color-red);
    }

.c-page-voice__product-name {
        font-size: 1.7rem;
        word-break: keep-all;
        font-weight: 700;
        color: var(--color-primary);
    }

.c-page-voice__product-more {
        font-size: 1.4rem;
        color: var(--color-text);
    }

/* ---------- 引用 ---------- */

.c-page-voice__quote {
        color: var(--color-lightest);
        text-align: center;
        background: var(--color-primary);
    }

.c-page-voice__quote .c-section__bg::after {
            content: "";
            position: absolute;
            inset: 0;
            background: radial-gradient(ellipse 60% 70% at 50% 45%, rgba(16, 58, 28, .6) 0%, rgba(16, 58, 28, .35) 60%, rgba(16, 58, 28, .15) 100%);
        }

.c-page-voice__quote-mark {
        display: block;
        font-family: var(--font-family-en);
        font-size: 5.6rem;
        line-height: 1;
        color: var(--color-yellow-01);
    }

.c-page-voice__quote-text {
        margin-top: 4px;
        font-family: var(--font-family-serif);
        font-size: clamp(22px, 2.6vw, 34px);
        font-weight: 700;
        line-height: 1.8;
        letter-spacing: .04em;
        text-shadow: 0 2px 12px rgba(0, 0, 0, .35);
    }

.c-page-voice__quote-rule {
        display: block;
        width: 100px;
        height: 1px;
        margin: 28px auto 0;
        background: var(--color-yellow-01);
    }

.c-page-voice__quote-by {
        margin-top: 18px;
        font-size: 1.6rem;
        letter-spacing: .1em;
        text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
    }

/* ===================================================================
  CSS information
  file name  :  c-page-news.css
  お知らせ 一覧 / 詳細
=================================================================== */

.c-page-news__bottom {
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 0;
        width: 100%;
        height: auto;
        opacity: .4;
        pointer-events: none;
    }

.c-page-news__columns {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(260px, 300px);
        gap: 44px;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: start;
    }

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

.c-page-news__columns {
            grid-template-columns: minmax(0, 1fr)
    }
        }

.c-page-news__main {
        min-width: 0;
    }

/* カテゴリチップ */

.c-page-news__chips {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 12px;
        margin-bottom: 32px;
    }

.c-page-news__chip {
        display: inline-block;
        padding: 9px 22px;
        font-size: 1.4rem;
        font-weight: 700;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-accent);
        border-radius: var(--radius-pill);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-page-news__chip:hover {
            color: var(--color-primary);
            background: var(--color-pale-02);
        }

.c-page-news__chip.is-current {
            color: var(--color-lightest);
            background: var(--color-primary);
        }

.c-page-news .c-news__list--archive {
        gap: 16px;
        margin-top: 0;
    }

.c-page-news .c-news__body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        min-width: 0;
    }

.c-page-news__empty {
        color: var(--color-text-sub);
    }

/* 詳細 */

.c-page-news__main-image {
        height: 320px;
        overflow: hidden;
        border-radius: var(--radius-product);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-news__main-image img {
            width: 100%;
            height: 100%;
            -o-object-fit: cover;
               object-fit: cover;
        }

.c-page-news__body {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
        margin-top: 32px;
        font-size: 1.6rem;
        line-height: 2.1;
        letter-spacing: .04em;
    }

.c-page-news__body img {
            border-radius: var(--radius-product);
        }

/* 旧サイトから取り込んだ本文: 画像・YouTube（自動埋め込み）を本文幅に合わせる */

.c-page-news__body figure {
            margin: 0;
        }

.c-page-news__body iframe {
            display: block;
            width: 100%;
            height: auto;
            aspect-ratio: 16 / 9;
            border: 0;
            border-radius: var(--radius-product);
        }

.c-page-news__body a {
            color: var(--color-primary);
            text-decoration: underline;
            word-break: break-all;
        }

.c-page-news__body a:hover {
                text-decoration: none;
            }

.c-page-news__actions {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        gap: 16px;
        margin-top: 32px;
    }

.c-page-news__nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        gap: 16px;
        margin-top: 40px;
        padding-top: 24px;
        font-size: 1.5rem;
        font-weight: 700;
        border-top: 1px solid var(--color-border-01);
    }

.c-page-news__nav a {
            color: var(--color-primary);
        }

.c-page-news__nav-item {
        min-width: 7em;
    }

.c-page-news__nav-item--next {
            text-align: right;
        }

.c-page-news__nav-back {
        color: var(--color-text) !important;
    }

.c-page-news__nav-back:hover {
            color: var(--color-primary) !important;
        }

/* ===================================================================
  CSS information
  file name  :  c-page-contact.css
  お問い合わせ／サンプル請求（SP はデザインのトークン値のみ変更、他は PC と同値）
=================================================================== */

.c-hero--contact .c-hero__label {
    letter-spacing: .14em;
}

/* h1 は PC のみ改行しない */
@media only screen and (max-width: 767px) {
.c-page-contact .c-hero--nowrap .c-hero__title {
        white-space: normal;
        word-break: auto-phrase
}
    }

/* ---------- PURPOSE ---------- */

.c-page-contact__purpose-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 196px), 1fr));
        gap: 18px;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        margin-top: 40px;
    }

.c-page-contact__card {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        padding: 22px 20px 24px;
        font-family: inherit;
        text-align: center;
        background: var(--color-lightest);
        border: 2px solid var(--color-border-01);
        border-radius: var(--radius-card-lg);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

.c-page-contact__card--primary {
            border-color: var(--color-accent);
        }

.c-page-contact__card:hover {
            border-color: var(--color-primary);
        }

.c-page-contact__card.is-selected {
            background: var(--color-pale-01);
            border-color: var(--color-primary);
        }

.c-page-contact__card-icon {
        position: absolute;
        top: 16px;
        left: 16px;
        width: 40px;
        height: 40px;
    }

.c-page-contact__card-pic {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        width: 100%;
        height: 96px;
        margin-top: 8px;
    }

.c-page-contact__card-pic img {
            width: auto;
            max-width: 96px;
            height: auto;
            max-height: 96px;
            -webkit-filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .14));
                    filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .14));
        }

.c-page-contact__card-title {
        margin-top: 16px;
        font-size: 1.7rem;
        font-weight: 700;
        line-height: 1.5;
        letter-spacing: .04em;
        color: var(--color-primary);
        word-break: auto-phrase;
    }

.c-page-contact__card-desc {
        margin-top: 12px;
        font-size: 1.3rem;
        line-height: 1.8;
        color: var(--color-text);
        text-wrap: pretty;
    }

.c-page-contact__card-arrow {
        display: block;
        margin-top: auto;
        padding-top: 18px;
    }

.c-page-contact__card-arrow svg {
            display: block;
        }

/* サンプル価格帯（左揃え。PC は商品画像を左右に絶対配置、SP は上に横並び） */

.c-page-contact__price {
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
        gap: 8px;
        /* デザインは content-box の min-height:120px（+ 上下 padding） */
        min-height: 172px;
        margin-top: 28px;
        padding: 26px 220px 26px 190px;
        background: var(--color-pale-01);
        border-radius: var(--radius-card);
    }

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

.c-page-contact__price {
            padding: 22px 20px
    }
        }

.c-page-contact__price-imgs {
        display: contents;
    }

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

.c-page-contact__price-imgs {
            display: -webkit-box;
            display: -ms-flexbox;
            display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
            -webkit-box-align: end;
                -ms-flex-align: end;
                    align-items: flex-end;
            gap: 20px;
            margin-bottom: 6px
    }
        }

.c-page-contact__price-img {
        position: absolute;
        bottom: 10px;
        width: auto;
        height: 135px;
        -webkit-filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .16));
                filter: drop-shadow(0 8px 14px rgba(0, 0, 0, .16));
    }

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

.c-page-contact__price-img {
            position: static;
            height: 110px
    }
        }

.c-page-contact__price-img--mc {
            left: 36px;
        }

.c-page-contact__price-img--m2 {
            right: 30px;
            bottom: 12px;
            height: 130px;
        }

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

.c-page-contact__price-img--m2 {
                height: 105px
        }
            }

.c-page-contact__price-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
        -webkit-box-align: baseline;
            -ms-flex-align: baseline;
                align-items: baseline;
        gap: 6px 18px;
        font-size: 1.6rem;
        font-weight: 700;
        line-height: 1.6;
        letter-spacing: .04em;
        color: var(--color-primary);
    }

.c-page-contact__price-em {
        color: var(--color-red);
    }

.c-page-contact__price-em strong {
            font-family: var(--font-family-en);
            font-size: 2.4rem;
            font-weight: 700;
        }

.c-page-contact__price-note {
        font-size: 1.3rem;
        line-height: 1.8;
        color: var(--color-text-sub);
    }

.c-page-contact__note {
        margin-top: 12px;
        font-size: 1.3rem;
        color: var(--color-text-sub);
    }

/* ---------- 電話 / LINE ---------- */

.c-page-contact__channel-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr));
        gap: 20px;
    }

.c-page-contact__channel {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        gap: 22px;
        padding: 26px 28px;
        background: var(--color-pale-01);
        border-radius: var(--radius-card);
    }

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

.c-page-contact__channel {
            gap: 12px;
            padding: 20px 18px
    }
        }

.c-page-contact__channel > img {
            width: 64px;
            height: 64px;
            -webkit-box-flex: 0;
                -ms-flex: none;
                    flex: none;
        }

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

.c-page-contact__channel > img {
                width: 48px;
                height: 48px
        }
            }

.c-page-contact__channel .c-tel--card {
            margin-top: 6px;
        }

.c-page-contact__channel-body {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        min-width: 0;
    }

.c-page-contact__channel-lead {
        font-size: 1.4rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-primary);
    }

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

.c-page-contact__channel-lead {
            font-size: 1.3rem
    }
        }

.c-page-contact__channel-hours {
        margin-top: 6px;
        font-size: 1.3rem;
        letter-spacing: .04em;
    }

.c-page-contact__line-btn {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        gap: 16px;
        /* デザインは content-box の max-width:300px（+ padding・枠） */
        max-width: 346px;
        margin-top: 12px;
        padding: 12px 20px 12px 24px;
        font-size: 1.4rem;
        font-weight: 700;
        letter-spacing: .04em;
        color: var(--color-primary);
        background: var(--color-lightest);
        border: 1px solid var(--color-primary);
        border-radius: var(--radius-pill);
        -webkit-transition: var(--trans-hover);
        transition: var(--trans-hover);
    }

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

.c-page-contact__line-btn {
            max-width: 336px;
            margin-top: 8px;
            padding: 10px 16px 10px 18px;
            font-size: 1.3rem
    }
        }

.c-page-contact__line-btn:hover {
            color: var(--color-lightest);
            background: var(--color-primary);
        }

/* LINE 友だち追加 QR（PC のみ。SP はボタンから直接追加） */

.c-page-contact__line-qr {
        -webkit-box-flex: 0;
            -ms-flex: none;
                flex: none;
        text-align: center;
    }

.c-page-contact__line-qr img {
            width: var(--size-line-qr);
            height: var(--size-line-qr);
            padding: var(--padding-line-qr);
            background: var(--color-lightest);
            border-radius: var(--radius-image);
        }

.c-page-contact__line-qr figcaption {
            margin-top: var(--gap-line-qr-caption);
            font-size: 1.1rem;
            line-height: 1.4;
            letter-spacing: .02em;
            color: var(--color-text-sub);
        }

/* ===================================================================
  CSS information
  file name  :  c-page-privacy.css
  プライバシーポリシー（SP もデザインは PC と同値）
=================================================================== */

.c-page-privacy__intro {
        font-size: 1.6rem;
        line-height: 2.1;
        letter-spacing: .04em;
    }

.c-page-privacy__list {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        gap: 20px;
        margin-top: 44px;
    }

.c-page-privacy__item {
        padding: 32px 36px;
        background: var(--color-lightest);
        border: 1px solid var(--color-border-01);
        border-radius: var(--radius-card);
        -webkit-box-shadow: var(--shadow-card);
                box-shadow: var(--shadow-card);
    }

.c-page-privacy__item h2 {
            font-size: 2rem;
            font-weight: 700;
            line-height: 1.6;
            color: var(--color-red);
            word-break: auto-phrase;
        }

.c-page-privacy__item p {
            margin-top: 12px;
            font-size: 1.5rem;
            line-height: 2;
            letter-spacing: .04em;
        }

.c-page-privacy__enacted {
        margin-top: 28px;
        font-size: 1.4rem;
        color: var(--color-text-sub);
    }

/*# sourceMappingURL=style.css.map */