/**
 * 昭和レトロ見出し（Xserver Webフォント）
 *
 * - 書体は design-system.css の --font-retro-*（役割ごと）
 *     キャッチコピー=シネマレター / カテゴリナビ=じゅん 501 / 大見出し=ぶらっしゅ /
 *     セクション見出し=じゅん 501 / 商品名=じゅん 501 / 小見出し=じゅん 501
 * - 読みやすさを保つため、使うのは短い見出しだけ。本文・価格・商品名一覧・
 *   フォーム・ボタンは従来のゴシックのまま
 * - Webフォントは1ウェイトしかないため、太字の疑似生成(にじみ・潰れ)を止める。
 *   読み込めなかった時のゴシックは本物の太字があるので、太さは従来どおり出る
 * - 読み込みスクリプトは default_frame.twig（購入手続き・マイページ等では読み込まない）
 * - 商品詳細ページの見出しは detail.twig 側の指定（--showa-heading-font 等）も参照
 */

/* キャッチコピー: ヘッダー上部の一文 */
.ec-headerRole__title h1,
.ec-headerRole__title .ec-headerTitle__promo p {
    font-family: var(--font-retro-tagline);
}

/* PCでは14pxで表示されていたが、細い書体なので16pxにする(スマホは元から大きい) */
@media (min-width: 768px) {
    .ec-headerRole__title .ec-headerTitle__promo h1,
    .ec-headerRole__title .ec-headerTitle__promo p {
        font-size: 1rem;
    }
}

/* カテゴリナビ（第1階層のみ）。スマホはメニュー(≡)内の Block/category_nav_sp.twig */
.ec-categoryNaviRole .ec-itemNav__nav > li > a,
.ec-headerCategoryArea__heading p,
.ec-headerCategoryArea .ec-itemNav__nav > li.category-parent > a:first-child {
    font-family: var(--font-retro-nav);
}

/* 大見出し: トップのスライダー */
.ec-sliderRole .main_visual h3 {
    font-family: var(--font-retro-display);
}

/* セクション見出し: トップの各ブロック・各ページの見出し */
.ec-navigationRole__heading,
.ec-secHeading__ja,
.ec-review-block__title,
.ec-review-heading,
.ec-review-list-heading,
.ec-pageHeader h1,
.ec-heading-title,
.info-section h3,
.ec-review-section h2 {
    font-family: var(--font-retro-section);
}

/* 商品名: 商品詳細（書体は detail.twig 側でも同じ変数を指定） */
.ec-headingTitle {
    font-family: var(--font-retro-product);
}

/* 小見出し: カード・信頼バッジ・FAQの分類・フッター・配送/ポイントページの項目 */
.ec-navigationCard__title,
.ec-trustBadge__title,
.faq-category-title,
.ec-footerMegaNav__heading,
.ec-borderedDefs dd h4 {
    font-family: var(--font-retro-small);
}

/* Webフォントを使う見出し共通 */
.ec-headerRole__title h1,
.ec-headerRole__title .ec-headerTitle__promo p,
.ec-categoryNaviRole .ec-itemNav__nav > li > a,
.ec-sliderRole .main_visual h3,
.ec-navigationRole__heading,
.ec-secHeading__ja,
.ec-review-block__title,
.ec-review-heading,
.ec-review-list-heading,
.ec-pageHeader h1,
.ec-heading-title,
.info-section h3,
.ec-review-section h2,
.ec-headingTitle,
.ec-navigationCard__title,
.ec-trustBadge__title,
.faq-category-title,
.ec-footerMegaNav__heading,
.ec-borderedDefs dd h4 {
    font-synthesis: none;
    letter-spacing: 0.04em;
}

/* スマホのメニュー(≡): 字間はインラインstyleの見た目のまま */
.ec-headerCategoryArea__heading p,
.ec-headerCategoryArea .ec-itemNav__nav > li.category-parent > a:first-child {
    font-synthesis: none;
}

/* 商品詳細ページ: detail.twig で書体・字間を指定している見出し */
.product-catchphrase-fullwidth h2,
.product-info-fullwidth .section-header,
.product-description-fullwidth .section-header,
.ec-productReviews h2,
.ec-shelfRole > div:first-child,
.ec-productRole__stock th,
.ec-numberInput label {
    font-synthesis: none;
}

/* カテゴリナビは幅が狭く折り返しやすいので字間を足さない */
.ec-categoryNaviRole .ec-itemNav__nav > li > a {
    letter-spacing: normal;
}