@charset "UTF-8";
/*//////////PCサイズ///////////*/
/*//////////PCサイズ///////////*/
@media screen and (min-width: 768px) {
/** ==============================
 * ファーストビュー start
 * ============================== **/
.MainVisualSection {
  position: relative;
  width: 100vw;
  /*height: calc(var(--vh, 1vh) * 100);
  height: 100vh;
   min-height: 600px; ← 任意で残してもOK */
  aspect-ratio: 16 / 12;
  overflow: hidden;
  background-color: #333;
}
/* ===== 動画背景 ===== */
.MainVisualSection__video-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.MainVisualSection__video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* ★ 黒オーバーレイ */
.MainVisualSection__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3); /* 黒＋透明30% */
  z-index: 2;
  pointer-events: none; /* 下の動画ボタンなどの操作を邪魔しない */
}
/* ===== ブランドMOVIEリンク・コピー配置 ===== */
.MainVisualSection__content {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
}
.MainVisualSection__brand-movie {
  align-self: flex-start;
  margin: 0 0 40px 40px;
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  pointer-events: auto;
}
/* ブランドムービーボタン */
.MainVisualSection__brand-link img {
  width: 10vw;
  height: auto;
}
/* ライトボックスのスタイル */
.VideoLightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 9999; /* 必ずヘッダーより前に */
  align-items: center;
  justify-content: center;
}
.VideoLightbox.is-active {
  display: flex;
}
.VideoLightbox__inner {
  position: relative;
  max-width: 90%;
  max-height: 80%;
}
.VideoLightbox__inner video {
  width: 100%;
  max-width: 1280px;
  height: auto;
  display: block;
}
.VideoLightbox__close {
  position: absolute;
  top: -2.5rem;
  right: -2.5rem;
  font-size: 2rem;
  color: #fff;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 10000; /* 念のためボタンも強く */
}
.MainVisualSection__brand-link:hover {
  opacity: 0.8;
}
.MainVisualSection__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  position: absolute;
  left: 10vw;
  top: 41%;
  margin: 0 0 0 0;
  z-index: 2;
  pointer-events: auto;
}
.MainVisualSection__en.serif {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.7rem;
  font-weight: 100;
  color: #fff;
  letter-spacing: 0.2rem;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
  line-height: 190%
}
/** ==============================
 * ファーストビュー end
 * ============================== **/
/* ==============================
   company-sec start
   ============================== */
.company-sec {
	position: relative;
	padding: 8vw 0 6vw;
	background-position: 0%;
	background-image: -webkit-linear-gradient(301deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 63.15%,rgba(129,145,162,1.00) 99.96%);
	background-image: -moz-linear-gradient(301deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 63.15%,rgba(129,145,162,1.00) 99.96%);
	background-image: -o-linear-gradient(301deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 63.15%,rgba(129,145,162,1.00) 99.96%);
	background-image: linear-gradient(149deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 63.15%,rgba(129,145,162,1.00) 99.96%);
}
.company-in {
  width: 70vw;
  margin: 5vw auto;
}
.company-in .ttl {
  margin: 0 0 5rem 0;
  font-size: 2.8rem;
}
/* 左カラム */
.company-words {
  max-width: 52vw;
}
.company-words .tag {
  margin: 1rem 0;
  padding: 0;
  letter-spacing: 0.12rem;
  text-align: left;
}
/* サブタイトル（見本の強調見出し） */
.company-sub {
  margin: 0 0 2.5rem 0;
  font-size: 2.2rem; /* conceptより一段下の大きめ見出し */
  line-height: 1.8;
  font-weight: 500;
  letter-spacing: 0.06rem;
  font-family: 'Noto Serif JP', serif;
}
/* 本文：conceptの .lead を踏襲 */
.company-words .lead {
  margin: 0 0 1.2rem 0.5rem;
  letter-spacing: 0.15rem;
  color: #3b3735;
  line-height: 2;
  font-size: 1.05rem;
  text-align: justify;
  font-weight: 400;
}
 /* 署名 */
  .message-sign {
    line-height: 1.6;
    letter-spacing: .08rem;
    margin: 4rem 0 0 -2px;
    font-size: 1.5rem;
  }
/* 右下の画像ブロック */
.company-photo {
  position: absolute;
  right: 10vw;
  bottom: 0;
  width: 32vw;
  overflow: hidden;
}
.company-photo img {
  width: 100%;
  height: auto;
  display: block;
}
/* ==============================
   company-sec end
   ============================== */
/* ==============================
   company-head start
   ============================== */
.company-head {
  padding: 8vw 0 5vw 0;
  background-color: #fbf9f6; /* 見本の淡い背景 */
  text-align: center;
}
.company-head .ttl {
  font-size: 2.5rem; /* concept と統一感を持たせつつ中央強調 */
  letter-spacing: 0.1rem;
  margin: 0;
}
/* ==============================
   company-head end
   ============================== */
/* ==============================
 * company-profile start
 * ============================== */
.company-profile{
  padding: 0 0 6vw 0;
  background-color: #f9f7f4; /* セクション背景のみ。各行には背景なし */
}
.company-profile__in{
  width: 80vw;
  margin: 0 auto;
}

/* リストのリセット */
.company-profile ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各行：左ラベル 14vw ／ 右内容 自動。複数 .data に対応 */
.company-profile li{
  display: grid; line-height: 100%;
  grid-template-columns: 14vw 1fr; /* 左：項目／右：内容 */
  row-gap: 0.8vw;                  /* 同一項目内で複数 .data を積む際の行間 */
  padding: 1.6vw 0;                  /* 指定：上下3vw */
  border-bottom: 0.0625rem solid #bfb8b0; /* 罫線（px不使用） */
}

/* 共通テキスト初期化 */
.company-profile p{ margin: 0 0 0 0.5rem;}

/* 左：項目ラベル */
.company-profile .label{
  grid-column: 1 / 2;
  align-self: start;
  display: inline-block;
  width: 14vw;               /* グリッドと同幅で固定 */
  font-weight: bold;
  color: #3b3735;
}

/* 右：内容（汎用） */
.company-profile .data{
  grid-column: 2 / 3;
  color: #3b3735;
 line-height: 100%;
  letter-spacing: 0.05rem;
}

/* 役員行だけ：役職／氏名を常に2カラムで揃える */
.company-profile .data--officer{
  /* 列幅を固定してズレ防止 */
  --role-col: 15vw;   /* 左：役職列 */
  --name-col: 6rem; /* 右：氏名列（約6文字幅＋わずかに余裕） */
  display: grid;
  grid-template-columns: var(--role-col) var(--name-col);
  column-gap: 0vw;
  align-items: baseline;
}

/* 役職・氏名（右寄せ、折り返しなし） */
.company-profile .data--officer .role{
  grid-column: 1 / 2;
  display: block;
}
.company-profile .data--officer .name{
  grid-column: 2 / 3;
  display: block;
  width: 100%;
  text-align: right;
  white-space: nowrap; /* 折り返し防止 */
}
/* ==============================
 * company-profile end
 * ============================== */
/* ==============================
 * company-map start
 * ============================== */
.company-map{
  padding: 0 0 0 0;
  background-color: #f9f7f4; /* 見本と同系の薄い背景 */
}
.company-map__in{
  width: 80vw;   /* 指定：幅80vw */
  margin: 0 auto;
}
.company-map__frame{
  width: 100%;
  height: 30vw;  /* 指定：高さ30vw */
  overflow: hidden;
  /* 角丸や影が必要ならここで追記（例：border-radius: 0.5rem;） */
}
.company-map__iframe{
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
/* ==============================
 * company-map end
 * ============================== */
/* ==============================
 * credo-sec start
 * ============================== */
.credo-sec{
  padding: 0 0 6vw 0;
  background-color: #fbf9f6;
}
.credo-in{
  width: 80vw;
  margin: 0 auto;
}
.credo-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 行：左ラベル14vw／右本文1fr（company-profileに準拠） */
.credo-list > li{
  display: grid;
  grid-template-columns: 14vw 1fr;
  row-gap: 0.8vw;
  padding: 1.5vw 0;
  border-bottom: 0.0625rem solid #bfb8b0;
}
.credo-sec .label{
  grid-column: 1 / 2;
  align-self: start;
  display: inline-block;
  width: 14vw;
  font-size: 1.3rem;
    font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  color: #3b3735;
  margin: 0;
  letter-spacing: 0.1rem;
}
.credo-sec .text{
  grid-column: 2 / 3;
  color: #3b3735;
  line-height: 1.9;
  letter-spacing: 0.05rem;
  margin: 0 5rem 0 0;
}

/* 番号リスト（行動指針／行動基準） */
.credo-sec .c-list{
  grid-column: 2 / 3;
  margin: 0;
  padding: 0;
  counter-reset: num;
}
.credo-sec .c-list li{
  list-style: none;
  display: grid;
  grid-template-columns: 2rem 1fr; /* 番号／本文 */
  column-gap: 0rem;
  counter-increment: num;
  color: #3b3735;
  line-height: 1.9;
  letter-spacing: 0.03rem;
    margin: 0 5rem 0 0;
	padding: 0.2vw;
}
.credo-sec .c-list li::before{
  content: counter(num) ".";
  display: block;
  width: 2rem;
  text-align: left;
  color: #3b3735;
}
/* ==============================
 * credo-sec end
 * ============================== */

/* ==============================
 * csr-head start（PC）
 * ============================== */
.CsrHeadSec{
  width: 100vw;
  background: #fbf9f6;
  text-align: center;
  padding: 6vw 0 3vw;
}
.CsrHeadSec .sec-in{
  width: 100vw;
  margin: 0 auto;
}
.CsrHeadSec .ttl{
  color: #6f6a66;
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  letter-spacing: .12rem;
  line-height: 1.6;
  font-size: 2.7rem;
  margin: 0 0 0.5rem;
}
.CsrHeadSec .ttl span{
  font-size: 80%; /* 括弧内だけ90% */
}
.CsrHeadSec .lead{
  color: #8f8983;
  letter-spacing: .12rem;
  margin: 0;
  text-align: center;
  font-size: 1.5rem;
  font-family: 'Noto Serif JP', serif;
}
/* ==============================
 * csr-head end
 * ============================== */
/* ==============================
 * csr-actions start（PC）
 * ============================== */
.CsrActionSec{
  padding: 3vw 0 6vw;
  background: #fbf9f6;
}
.CsrActionSec__in{
  width: 80vw;
  margin: 0 auto;
}

/* 各項目：左=画像／右=テキスト */
.af-item{
  display: grid;
  grid-template-columns: 10vw 1fr;  /* サムネ固定幅＋本文 */
  column-gap: 1.4rem;
  align-items: center;
  padding: 2vw 0;
    border-bottom: 0.0625rem solid #bfb8b0;
}

/* サムネ（グレー四角プレースホルダ。画像差し替えOK） */
.af-thumb{
  width: 10vw;
  aspect-ratio: 1 / 1;
  margin: 0 0 0 0.5rem;;
  background: #d9d3cf;      /* 置換前のプレースホルダ色 */
  overflow: hidden;
}
.af-thumb img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* 右：文章 */
.af-words{ margin: 0 0 0 1rem;}
.af-sub{
  margin: .2rem 0 .6rem;
  font-weight: 700;
  font-size: 1.05rem;       /* 既存セクションの文字感に合わせ控えめ */
  letter-spacing: .04rem;
  color: #3b3735;
}

/* 箇条書き（・で始まる体裁） */
.af-list{
  margin: 0;
  padding: 0;               /* 内側余白は li 側で付ける */
  list-style: none;         /* 既定の●は消す（重複防止） */
}

.af-list li{
  position: relative;
  padding-left: 1.2rem;     /* マーカー幅ぶんのぶら下げインデント */
  font-size: 1.0rem;        /* ビルドSP：本文 */
  line-height: 1.8;         /* ビルドSP：行間 */
  letter-spacing: .02rem;
  color: #6f6963;
  margin: 0;                /* 必要なら項目間余白を追加 */
}

/* カスタムマーカー（・） */
.af-list li::before{
  content: "・";
  position: absolute;
  left: 0;
  top: .39em;               /* 1行目のベースラインに合わせて微調整 */
  line-height: 1;           /* 余計な高さを持たせない */
  color: #6f6963;
}

/* ==============================
 * csr-actions end
 * ============================== */
}
/*//////////SPサイズ///////////*/
@media screen and (max-width:767px) {
/** ==============================
 * ファーストビュー (SP) start
 * ============================== **/
.MainVisualSection {
  position: relative;
  width: 100vw;
  aspect-ratio: 16 / 12;           /* ヒーローは例外で100vw運用を継続 */
  overflow: hidden;
  background-color: #333;
}

/* ===== 動画背景 ===== */
.MainVisualSection__video-bg {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.MainVisualSection__video-bg video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* ★ 黒オーバーレイ */
.MainVisualSection__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);  /* 黒＋透明30% */
  z-index: 2;
  pointer-events: none;            /* 下の動画ボタンなどの操作を邪魔しない */
}

/* ===== ブランドMOVIEリンク・コピー配置 ===== */
.MainVisualSection__content {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  pointer-events: none;
}

.MainVisualSection__brand-movie {
  align-self: flex-start;
  margin: 0 0 4vw 4vw;             /* 40px → 4vw */
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  pointer-events: auto;
}
/* ブランドムービーボタン */
.MainVisualSection__brand-link img {
  width: 24vw;                     /* 10vw → タップ/視認性を確保 */
  height: auto;
}

/* ライトボックスのスタイル */
.VideoLightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.8);
  z-index: 9999;                   /* 必ずヘッダーより前に */
  align-items: center;
  justify-content: center;
}
.VideoLightbox.is-active {
  display: flex;
}
.VideoLightbox__inner {
  position: relative;
  max-width: 90vw;                 /* 90% → 90vw */
  max-height: 80vh;                /* 80% → 80vh */
}
.VideoLightbox__inner video {
  width: 100%;
  max-width: 90vw;                 /* 1280px → 90vw */
  height: auto;
  display: block;
}
.VideoLightbox__close {
  position: absolute;
  top: .8rem;                      /* -2.5rem → 画面内に固定 */
  right: .8rem;
  font-size: 1.6rem;
  color: #fff;
  background: none;
  border: none;
  cursor: pointer;
  z-index: 10000;                  /* 念のためボタンも強く */
}

.MainVisualSection__brand-link:hover {
  opacity: 0.8;
}

.MainVisualSection__copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;         /* 右寄せ → 左寄せで可読性優先 */
  position: absolute;
  left: 6.5vw;                     /* ビルドSPの安全域 */
  right: 6.5vw;
  bottom: 12vh;                    /* 端末UIと干渉しにくい位置 */
  margin: 0;
  z-index: 2;
  pointer-events: auto;
}

.MainVisualSection__en.serif {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.8rem;               /* PCで大きい役割文字 → SPは1.8remでデザイン優先 */
  font-weight: 100;
  color: #fff;
  letter-spacing: .12rem;          /* 0.2rem → やや詰める */
  text-shadow: 0 .125rem 1.125rem rgba(0, 0, 0, 0.18); /* 0 2px 18px → rem換算 */
  line-height: 1.8;                /* 190% → 規定の1.8 */
}
/** ==============================
 * ファーストビュー (SP) end
 * ============================== **/
/* ==============================
   company-sec (SP) start
   ============================== */
.company-sec {
	position: relative;
	padding: 4rem 0 0; /* 8vw 0 6vw → SP基準 */
	background-position: 0%;
	background-image: -webkit-linear-gradient(314deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 43.02%,rgba(129,145,162,1.00) 99.96%);
	background-image: -moz-linear-gradient(314deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 43.02%,rgba(129,145,162,1.00) 99.96%);
	background-image: -o-linear-gradient(314deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 43.02%,rgba(129,145,162,1.00) 99.96%);
	background-image: linear-gradient(136deg,rgba(226,230,236,1.00) 0%,rgba(183,192,203,1.00) 43.02%,rgba(129,145,162,1.00) 99.96%);
}

.company-in {
  width: 87vw;              /* 70vw → 既定：87vw（左右6.5vw） */
  margin: 0 auto;
}

.company-in .ttl {
  margin: 10vw 0 1.6rem 0;     /* 5rem → 圧縮 */
  font-size: 1.6rem;        /* ビルドSP：見出し */
  line-height: 1.4;
  text-align: center;
}

/* 左カラム → SPは全幅 */
.company-words {
  max-width: 100%;          /* 52vw → 100% */
}

.company-words .tag {
	margin: 0 0 0 0;
	letter-spacing: .12rem;
  padding: .25rem 0;
}

/* サブタイトル（役割見出しなのでやや大きめを維持） */
.company-sub {
  margin: 0 0 1.6rem 0;     /* 2.5rem → 1.6rem */
  font-size: 1.5rem;        /* 2.2rem → 役割優先で大きめ維持 */
  line-height: 1.7;
  font-weight: 500;
  letter-spacing: .06rem;
  font-family: 'Noto Serif JP', serif;
}

/* 本文：ビルドSP基準 */
.company-words .lead {
  margin: 0 0 1rem 0;
  letter-spacing: .15rem;
  color: #3b3735;
  line-height: 2;         /* 2 → 1.8 */
  font-size: 0.9rem;        /* 1.05rem → 1.0rem */
  text-align: justify;
  font-weight: 400;
}

/* 画像ブロック：絶対配置→通常フロー／左右中央想定／1:1でトリミング */
.company-photo {
  position: static;          /* absolute → static */
  width: 100%;               /* 32vw → 100%（親の87vw内で中央） */
  margin: 1.6rem 0 0;        /* テキストとの間隔を確保 */
  overflow: hidden;
  aspect-ratio: 1 / 1;       /* 正方形で統一 */
}

.company-photo img {
  width: 60%;
  height: 100%;
  margin: auto;
  display: block;
  object-fit: cover;          /* トリミングしてフィット */
  object-position: center top;/* 左右中央／上端を優先して見せる */
}
/* ==============================
   company-sec (SP) end
   ============================== */
/* ==============================
   company-head (SP) start
   ============================== */
.company-head {
  padding: 3rem 0;            /* 8vw 0 5vw → SP基準の上下余白 */
  background-color: #fbf9f6;   /* 見本の淡い背景 */
  text-align: center;
}
.company-head .ttl {
  width: 87vw;                 /* 左右6.5vwの安全域 */
  margin: 0 auto;              /* 中央配置 */
  font-size: 1.6rem;           /* ビルドSP：見出し */
  line-height: 1.4;
  letter-spacing: 0.1rem;
}
/* ==============================
   company-head (SP) end
   ============================== */
/* ==============================
 * company-profile (SP) start
 * ============================== */
.company-profile{
  padding: 0 0 3rem 0;                 /* 6vw → SP基準 */
  background-color: #f9f7f4;           /* セクション背景のみ。各行には背景なし */
}
.company-profile__in{
  width: 87vw;                          /* 80vw → 既定：87vw（左右6.5vw） */
  margin: 0 auto;
}

/* リストのリセット */
.company-profile ul{
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 各行：SPは基本“縦積み”（ラベル→内容）で可読性優先 */
.company-profile li{
  display: grid;
  grid-template-columns: 1fr;          /* 14vw 1fr → 1カラム */
  row-gap: .6rem;                       /* 0.8vw → .6rem */
  padding: 1rem 0;                      /* 1.6vw → 1rem */
  border-bottom: .0625rem solid #bfb8b0;/* 罫線（px不使用） */
}

/* 共通テキスト初期化 */
.company-profile p{
  margin: 0;                            /* 左インデントを解除 */
}

/* 左：項目ラベル（行頭） */
.company-profile .label{
  grid-column: 1 / -1;
  align-self: start;
  display: inline-block;
  width: auto;                          /* 14vw 固定 → 可変 */
  font-weight: bold;
  color: #3b3735;
  font-size: 1.0rem;                    /* ビルドSP：本文サイズ相当 */
  line-height: 1.8;                     /* ビルドSP：行間 */
}

/* 右：内容（汎用） */
.company-profile .data{
  grid-column: 1 / -1;
  color: #3b3735;
  font-size: 1.0rem;                    /* ビルドSP：本文 */
  line-height: 1.8;                     /* 可読性優先 */
  letter-spacing: .05rem;
}

/* 役員行のみ：役職／氏名をSPでも2カラムで揃える */
.company-profile .data--officer{
  /* 役職（左）と氏名（右）で2カラムを維持しつつ、狭幅でも折返しに強い設定へ */
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto; /* 左は可変、右は内容幅 */
  column-gap: .8rem;
  align-items: baseline;
}

/* 役職・氏名（SPでは可読性優先で折返し許容） */
.company-profile .data--officer .role{
  grid-column: 1 / 2;
  display: block;
  line-height: 1.8;
}
.company-profile .data--officer .name{
  grid-column: 2 / 3;
  display: block;
  text-align: right;
  line-height: 1.8;
  /* PCの nowrap はSPでは解除（はみ出し防止） */
  white-space: normal;
}
/* ==============================
 * company-profile (SP) end
 * ============================== */
/* ==============================
 * company-map (SP) start
 * ============================== */
.company-map{
  padding: 2rem 0;                 /* 余白をSP基準で付与 */
  background-color: #f9f7f4;       /* 見本と同系の薄い背景 */
}
.company-map__in{
  width:100vw;                     /* 80vw → 既定：87vw（左右6.5vw） */
  margin: 0 auto;
}
.company-map__frame{
  width: 100%;
  aspect-ratio: 4 / 5;             /* 高さ30vw固定 → 比率管理で安定表示 */
  overflow: hidden;
  /* 角丸や影が必要ならここで追記
     例：border-radius: .5rem; */
}
.company-map__iframe{
  width: 100%;
  height: 100%;
  display: block;
  border: 0;
}
/* ==============================
 * company-map (SP) end
 * ============================== */
/* ==============================
 * credo-sec (SP) start
 * ============================== */
.credo-sec{
  padding: 0 0 3rem 0;                /* 6vw → SP基準 */
  background-color: #fbf9f6;
}
.credo-in{
  width: 87vw;                        /* 80vw → 既定：87vw（左右6.5vw） */
  margin: 0 auto;
}
.credo-list{
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 行：SPは縦積み（ラベル→本文） */
.credo-list > li{
  display: grid;
  grid-template-columns: 1fr;         /* 14vw 1fr → 1カラム */
  row-gap: .6rem;                     /* 0.8vw → .6rem */
  padding: 1rem 0;                    /* 1.5vw → 1rem */
  border-bottom: .0625rem solid #bfb8b0;
}

/* 左：項目ラベル（行頭） */
.credo-sec .label{
  grid-column: 1 / -1;
  align-self: start;
  display: inline-block;
  width: auto;                        /* 14vw 固定 → 可変 */
  font-size: 1.0rem;                  /* ビルドSP：本文相当 */
  font-family: 'Noto Serif JP', serif;
  font-weight: 500;
  color: #3b3735;
  margin: 0;
  letter-spacing: .1rem;
  line-height: 1.8;
}

/* 右：本文 */
.credo-sec .text{
  grid-column: 1 / -1;
  color: #3b3735;
  font-size: 1.0rem;                  /* ビルドSP：本文 */
  line-height: 1.8;                   /* 1.9 → 1.8 */
  letter-spacing: .05rem;
  margin: 0;                          /* 右余白 5rem を解除 */
}

/* 番号リスト（行動指針／行動基準） */
.credo-sec .c-list{
  grid-column: 1 / -1;                /* 2列目指定 → 全幅に */
  margin: .4rem 0 0 0;
  padding: 0;
  counter-reset: num;
}
.credo-sec .c-list li{
  list-style: none;
  display: grid;
  grid-template-columns: 1.6rem 1fr;  /* 番号／本文（SP向けに最適化） */
  column-gap: .4rem;
  counter-increment: num;
  color: #3b3735;
  font-size: 1.0rem;
  line-height: 1.8;
  letter-spacing: .03rem;
  margin: 0;                          /* 右余白 5rem を解除 */
  padding: .2rem 0;                   /* 0.2vw → .2rem */
  align-items: start;
}
.credo-sec .c-list li::before{
  content: counter(num) ".";
  display: block;
  width: 1.6rem;
  text-align: left;
  color: #3b3735;
}
/* ==============================
 * credo-sec (SP) end
 * ============================== */
/* ==============================
 * csr-head (SP) start
 * ============================== */
.CsrHeadSec{
  width: 100vw;
  background: #fbf9f6;
  text-align: center;
  padding: 0rem 0 2rem;               /* 6vw 0 3vw → SP基準 */
}
.CsrHeadSec .sec-in{
  width: 87vw;                         /* 既定の安全域 */
  margin: 0 auto;
}
.CsrHeadSec .ttl{
  color: #6f6a66;
  font-family: 'Noto Serif JP', serif;
  font-weight: 400;
  letter-spacing: .12rem;
  line-height: 1.4;
  font-size: 1.6rem;                   /* ビルドSP：見出し */
  margin: 0 0 1rem;
}
.CsrHeadSec .ttl span{
  font-size: 80%;                      /* 括弧内などを相対縮小 */
}
.CsrHeadSec .lead{
  color: #8f8983;
  letter-spacing: .08rem;              /* リードの既定感に合わせ控えめ */
  margin: 0;
  text-align: center;
  font-size: 1.0rem;                   /* ビルドSP：本文 */
  line-height: 1.8;                    /* ビルドSP：行間 */
  font-family: 'Noto Serif JP', serif;
}
/* ==============================
 * csr-head (SP) end
 * ============================== */





/* ==============================
 * csr-actions (SP) start
 * ============================== */
.CsrActionSec{
  padding: 0rem 0 4rem 0;                  /* 3vw 0 6vw → SP基準 */
  background: #fbf9f6;
}
.CsrActionSec__in{
  width: 87vw;                      /* 修正版に合わせて 80vw */
  margin: 0 auto;
}

/* 各項目：サムネ → 見出し → 本文（縦積み） */
.af-item{
  display: grid;
  grid-template-columns: 1fr;       /* 10vw 1fr → 1カラム */
  row-gap: .8rem;
  column-gap: 0;
  align-items: start;
  padding: 1.2rem 0;                /* 2vw → 1.2rem */
  border-bottom: .0625rem solid #bfb8b0;
}

/* サムネ（中央寄せ・正方形） */
.af-thumb{
  width: 22vw;                      /* 修正版パターン：22vw */
  aspect-ratio: 1 / 1;
  margin: 0 auto;                   /* 中央寄せ */
  background: #d9d3cf;
  overflow: hidden;
}
.af-thumb img{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
}

/* 右：文章（実質、サムネ下のテキスト） */
.af-words{ 
  margin: 0;
}

/* サブ見出し：中央・太字 */
.af-sub{
  margin: 1rem auto .3rem;          /* 修正版パターン */
  font-weight: 700;
  font-size: 1.1rem;                /* やや強調 */
  letter-spacing: .04rem;
  color: #3b3735;
  text-align: left;
}

/* 箇条書き（・で始まる体裁） */
.af-list{
  margin: 0;
  padding: 0;               /* 内側余白は li 側で付ける */
  list-style: none;         /* 既定の●は消す（重複防止） */
}

.af-list li{
  position: relative;
  padding-left: 1rem;     /* マーカー幅ぶんのぶら下げインデント */
  font-size: 0.9rem;        /* ビルドSP：本文 */
  line-height: 1.8;         /* ビルドSP：行間 */
  letter-spacing: .02rem;
  color: #6f6963;
  text-align: justify;
  margin: 0;                /* 必要なら項目間余白を追加 */
}

/* カスタムマーカー（・） */
.af-list li::before{
  content: "・";
  position: absolute;
  left: 0;
  top: .47em;               /* 1行目のベースラインに合わせて微調整 */
  line-height: 1;           /* 余計な高さを持たせない */
  color: #6f6963;
}

/* ==============================
 * csr-actions (SP) end
 * ============================== */

}