/* ===================================================================
   まいまいポケット カスタムスタイル
   Webflow生成CSSへの上書き。このファイルを直接編集すること。
   =================================================================== */

/* -------------------------------------------------------------------
   コース一覧カード レイアウト修正
   問題1: タイトル行数によってガイド名の縦位置がズレる
   問題2: ホバー時にカードの高さが変わる
   原因:  .corsesub { top: 95% } が不定な高さに依存しているため
   対策:  flexbox でガイド名を常にカード下端に固定する
   ------------------------------------------------------------------- */

/* link-block を flex コンテナ化してグリッドセルいっぱいに広げる */
.coursewrapper.boxshadow .link-block.w-inline-block {
  display: flex !important;
  flex-direction: column;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}

/* サムネイル画像エリアは縮まないよう固定 */
.coursewrapper.boxshadow .image-inner {
  flex-shrink: 0;
  aspect-ratio: 3 / 2;
}

/* 一覧カードのサムネイル枠を常に3:2にする */
.coursewrapper.boxshadow .corsethumb {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

/* project-info を flex 列方向にして残り高さを占有する */
.coursewrapper.boxshadow .project-info {
  display: flex !important;
  flex-direction: column;
  flex: 1;
  min-height: unset !important;
}

/* サブタイトルが余白を吸収 → ガイド名が自然に下端に固定される */
/* <br> タグによるかさ増しは不要になるが、既存の記述は無害なため残す */
.coursewrapper.boxshadow .text-block-3.corsesubtitle {
  flex: 1;
  min-height: unset !important;
}

/* corsesub の top: 95% を解除（flexbox で不要になる） */
.coursewrapper.boxshadow .corsesub {
  position: static !important;
  top: auto !important;
  margin-top: auto;
}

/* -------------------------------------------------------------------
   ホバーアニメーション修正
   問題: bottom プロパティの変更はレイアウトフローに影響し、
         同行カードの高さが連動して変わってしまう
   対策: transform: translateY に変更（視覚のみ、レイアウト影響なし）
   ------------------------------------------------------------------- */
.coursewrapper.boxshadow {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  bottom: 0 !important;
}

.coursewrapper.boxshadow:hover {
  transform: translateY(-6px);
  bottom: 0 !important;
  box-shadow: 0 8px 24px 0 rgba(0,0,0,0.12) !important;
}
