/* pamphlet.css - パンフレット紹介ページ専用スタイル */
/* common.cssのCSS変数(:root)は再定義しない */

/* ============================================================
   ページ全体
   ============================================================ */
.pamphlet-page-main {
  background-color: var(--color-bg-gray-03);
  padding-top: 190.845px;
}

/* ============================================================
   パンくずリスト
   ============================================================ */
.pamphlet-breadcrumb {
  padding: 8px var(--container-medium);
}

.pamphlet-breadcrumb__inner {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pamphlet-breadcrumb__link {
  font-family: var(--font-heading);
  font-size: var(--fontsize-text-small);
  color: var(--color-font-black-01);
  text-decoration: none;
  transition: color 0.2s ease;
}

.pamphlet-breadcrumb__link:hover {
  color: var(--color-font-keycolor);
  text-decoration: underline;
}

.pamphlet-breadcrumb__sep {
  font-size: var(--fontsize-text-small);
  color: var(--color-font-gray-01);
}

.pamphlet-breadcrumb__current {
  font-family: var(--font-heading);
  font-size: var(--fontsize-text-small);
  color: var(--color-font-gray-01);
}

/* ============================================================
   ページタイトル
   ============================================================ */
.pamphlet-page-ttl {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-top: var(--margin-block-03);
  padding-bottom: 0;
		max-width:1280px;
	margin:0 auto;
	margin-bottom:var(--margin-block-03);
}

.pamphlet-page-ttl__en {
  font-family: var(--font-accent);
  font-weight: 500;
  font-size: 20px;
  color: var(--color-font-keycolor);
  letter-spacing: 2px;
  line-height: normal;
}

.pamphlet-page-ttl__ja {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: 48px;
  color: var(--color-font-black-01);
  letter-spacing: 2.4px;
  line-height: 1.7;
}

/* ============================================================
   メインコンテンツ
   ============================================================ */
.pamphlet-main-content {
  max-width: 1280px;
  margin: 0 auto;
  padding-bottom: var(--margin-block-04);
}

/* ============================================================
   更新情報バー
   ============================================================ */
.pamphlet-notice {
  border: 1px solid var(--color-border-gray-03);
  border-radius: 5px;
  padding: 12px 30px 15px;
  margin-bottom: var(--margin-block-01);
}

.pamphlet-notice__text {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--fontsize-text-normal);
  color: var(--color-font-gray-01);
  line-height: 1.6;
  white-space: nowrap;
}

/* ============================================================
   パンフレット一覧
   ============================================================ */
.pamphlet-cards {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: var(--margin-block-01);
}

/* ============================================================
   パンフレットカード
   ============================================================ */
.pamphlet-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: var(--margin-block-01);
  border-bottom: 1px dashed var(--color-border-black-01);
  padding-bottom: var(--margin-block-01);
}

/* カード画像 */
.pamphlet-card__img {
  width: 200px;
  height: 283.61px;
  flex-shrink: 0;
  border-radius: 5px;
  overflow: hidden;
}

.pamphlet-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  max-width: none; /* common.cssの img { max-width: 100% } を上書き */
}

/* カード本文 */
.pamphlet-card__body {
  flex: 1 0 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.pamphlet-card__title {
  font-family: var(--font-heading);
  font-weight: 500;
  font-size: var(--fontsize-text-large);
  color: var(--color-font-black-01);
  line-height: 1.6;
}

.pamphlet-card__desc {
  font-family: var(--font-heading);
  font-weight: 400;
  font-size: var(--fontsize-text-normal);
  color: var(--color-font-black-01);
  line-height: 2;
}

/* ボタンラッパー */
.pamphlet-card__btn-wrap {
  padding-top: 16px;
  /* align-items: flex-start を設定してボタンが全幅に伸びないようにする */
  display: flex;
  align-items: flex-start;
}

/* ============================================================
   レスポンシブ（モバイル: max-width 767px）
   ============================================================ */
@media (max-width: 767px) {
  .pamphlet-page-main {
    padding-top: 92px;
  }

  .pamphlet-page-ttl__ja {
    font-size: 32px;
  }

  .pamphlet-notice__text {
    white-space: normal;
  }

  .pamphlet-main-content {
    padding: var(--margin-block-02) var(--container-medium) var(--margin-block-03);
  }

  .pamphlet-card {
    flex-direction: column;
    align-items: flex-start;
  }

  .pamphlet-card__img {
    width: 100%;
    height: auto;
    aspect-ratio: 200 / 283.61;
  }
}