/* トップページの VISION 欄（home.php の #vision）。詳しくは /vision/。
   見出しはサイト共通の .c-h（MISSION と同じ大きさ・一文字ずつせり上がる動き）。ボタンは共通の .c-btn --c1 --dot */
.p-homeVision { position: relative; padding: 120px 0 100px; }
.p-homeVision__body { display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); gap: 64px; align-items: end; margin-top: 30px; }
.p-homeVision__h02 {
  font-family: "Midashi Go MB31", "Zen Kaku Gothic New", sans-serif; font-weight: bold; color: #222222;
  font-size: 2rem; line-height: 1.5; margin-bottom: 24px;
}
.p-homeVision__lead { font-size: 1.125rem; line-height: 1.9; margin-bottom: 36px; max-width: 34em; }
.p-homeVision__btn { display: inline-block; }
.p-homeVision__btn .c-btn { padding-left: 48px; padding-right: 88px; min-height: 64px; }

.p-homeVision__links { list-style: none; margin: 0; padding: 0; border-top: 1px solid #DADCDC; }
.p-homeVision__links li { border-bottom: 1px solid #DADCDC; }
.p-homeVision__links a {
  display: grid; grid-template-columns: 2.5em minmax(0, 1fr) auto; align-items: center; gap: 12px;
  padding: 22px 4px; color: #222222 !important; font-weight: 700; line-height: 1.5; transition: padding-left .25s ease-out;
}
.p-homeVision__links .num { font-family: "Poppins", sans-serif; font-weight: 600; font-size: 0.875rem; color: #484E52; }
.p-homeVision__links .arw { font-size: 1.25rem; color: #484E52; transition: transform .25s ease-out; }
.p-homeVision__links a:hover { padding-left: 12px; }
.p-homeVision__links a:hover .arw { transform: translateX(4px); color: #222222; }

@media screen and (max-width: 1100px) {
  .p-homeVision__body { grid-template-columns: minmax(0, 1fr); gap: 48px; }
}
@media screen and (max-width: 767px) {
  .p-homeVision { padding: 60px 0 60px; }
  .p-homeVision__body { margin-top: 20px; gap: 36px; }
  .p-homeVision__h02 { font-size: 1.5rem; }
  .p-homeVision__lead { font-size: 1rem; margin-bottom: 28px; }
  .p-homeVision__btn { display: block; }
  .p-homeVision__btn .c-btn { padding-left: 43px; padding-right: 64px; min-height: 54px; }
  .p-homeVision__links a { padding: 18px 2px; }
}
.p-homeVision__h02 .nb { display: inline-block; }

/* トップの共創ストーリー欄（home.php の #story・1.0.2〜）。詳しくは /story/。写真・共創の相手・製品名だけのあっさりした一覧 */
.p-homeStoryList__label { position: relative; z-index: 1; font-family: "Midashi Go MB31", "Zen Kaku Gothic New", sans-serif; font-weight: bold; color: #222222; font-size: 1.5rem; margin-bottom: 8px; }
.p-homeStoryList__lead { position: relative; z-index: 1; font-size: 1.0625rem; line-height: 1.9; margin-bottom: 36px; }
.p-homeStoryList { position: relative; z-index: 1; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 20px; }
.p-homeStoryList a { display: block; color: #222222 !important; }
.p-homeStoryList__img { display: block; border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 2; background: #DADCDC; margin-bottom: 12px; }
.p-homeStoryList__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease-out; }
.p-homeStoryList a:hover .p-homeStoryList__img img { transform: scale(1.05); }
.p-homeStoryList__meta { display: block; font-size: 0.8125rem; color: #484E52; margin-bottom: 2px; }
.p-homeStoryList__name { display: block; font-weight: 700; font-size: 1.0625rem; line-height: 1.5; }
.p-homeStoryList a:hover .p-homeStoryList__name { text-decoration: underline; text-decoration-color: #FFCC33; text-underline-offset: 4px; }
.p-homeStoryList__btn { position: relative; z-index: 1; display: inline-block; margin-top: 44px; }
.p-homeStoryList__btn .c-btn { padding-left: 48px; padding-right: 88px; min-height: 64px; }
@media screen and (max-width: 1100px) {
  .p-homeStoryList { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media screen and (max-width: 767px) {
  .p-homeStoryList__label { font-size: 1.25rem; }
  .p-homeStoryList__lead { font-size: 1rem; margin-bottom: 24px; }
  .p-homeStoryList { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
  .p-homeStoryList__name { font-size: 0.9375rem; }
  .p-homeStoryList__btn { display: block; margin-top: 32px; }
  .p-homeStoryList__btn .c-btn { padding-left: 43px; padding-right: 64px; min-height: 54px; }
}

/* トップ背景の2つ目のパターン（融合と拡散・1.0.3〜）。現行の .p-homeMv__canvas と透明度を入れ替えて交互に出す（assets/js/mv-grow.js） */
.p-homeMv__grow { position: absolute; left: 0; top: 0; width: 100%; height: 100vh; z-index: 0; pointer-events: none; opacity: 0; transition: opacity 2.4s ease; }
.p-homeMv__grow svg { display: block; width: 100%; height: 100%; }
.p-homeMv__growTri { mix-blend-mode: multiply; }
.p-homeMv__canvas { transition: opacity 2.4s ease; }
.p-homeMv.is-grow .p-homeMv__grow { opacity: 1; }
.p-homeMv.is-grow .p-homeMv__canvas { opacity: 0; }
@media screen and (max-width: 767px) {
  .p-homeMv__grow { height: 180vw; }
}
