/*
 * 天命積運術 — 親となる共通デザイン規格
 * PC: 1440px のデザイン、SP: 750px のデザインを 375px 幅として参照。
 * 番号は各系列内で小さい値から大きい値へ並ぶ。
 * 個別の背景画像、特殊な配置・装飾は各ページの CSS に置く。
 */

:root {
    /* 書体 2種＋基本文字サイズ 1種 */
    --tenmei-font-serif: "Noto Serif JP", "Yu Mincho", "Hiragino Mincho ProN", serif;
    --tenmei-font-sans: "Noto Sans JP", "Yu Gothic", "Hiragino Kaku Gothic ProN", sans-serif;
    --tenmei-font-size-base: 16px;

    /* 文字サイズ 7種：PC 12 / 14 / 16 / 18 / 24 / 30 / 48px */
    --tenmei-fs-1: 0.8em;
    --tenmei-fs-2: 0.9333em;
    --tenmei-fs-3: 1.0667em;
    --tenmei-fs-4: 1.2em;
    --tenmei-fs-5: 1.6em;
    --tenmei-fs-6: 2.1em;
    --tenmei-fs-7: 3.2em;
    --tenmei-fs-8: 4.8em;

    /* 行間 3種・字間 3種・太さ 2種 */
    --tenmei-lh-1: 1.7;
    --tenmei-lh-2: 1.9;
    --tenmei-lh-3: 2.1;
       --tenmei-lh-4: 2.4;
 
    --tenmei-ls-1: 0.08em;
    --tenmei-ls-2: 0.12em;
    --tenmei-ls-3: 0.16em;
    --tenmei-fw-1: 400;
    --tenmei-fw-2: 500;

    /* margin / padding / gap 共通の 5 段階。基本文字 15px 時に約 8 / 16 / 24 / 40 / 80px。 */
    --tenmei-space-0: 0; 
    --tenmei-space-1: 0.5333em;
    --tenmei-space-2: 1.0667em;
    --tenmei-space-3: 1.6em;
    --tenmei-space-4: 2.6667em;
    --tenmei-space-5: 5.3333em;

    /* 文章幅 / 標準コンテンツ幅 / 広い外枠。左右の画面余白は別規格。 */
    --tenmei-width-1: 720px;
    --tenmei-width-2: 840px;
    --tenmei-width-3: 1100px;
    --tenmei-page-gutter: 2.6667em;

    /* 共通色 9種。ボタンのグラデーション色などは部品固有。 */
    --tenmei-color-text: #272526;
    --tenmei-color-muted: #68635e;
    --tenmei-color-gold: #c4a64d;
    --tenmei-color-gold-deep: #aa8734;
    --tenmei-color-red: #d74413;
    --tenmei-color-white: #fff;
    --tenmei-color-paper: #fffefa;
    --tenmei-color-panel: #fbfaf5;
    --tenmei-color-border: rgb(196 166 77 / 62%);

    --tenmei-border-width: 1px;
}

/* 基本表示 */
.tenmei-site *,
.tenmei-site *::before,
.tenmei-site *::after {
    box-sizing: border-box;
}

body.tenmei-site {
    margin: 0;
    background-color: var(--tenmei-color-white);
    color: var(--tenmei-color-text);
    font-family: var(--tenmei-font-serif);
    font-size: var(--tenmei-font-size-base);
    line-height: var(--tenmei-lh-2);
    font-weight: var(--tenmei-fw-1);
}
.tenmei-font-cormorant {
	font-family: "Cormorant Garamond", "Noto Serif JP", Georgia, serif !important;
}
/* 文字：各番号に基本のサイズ・行間・字間・太さをまとめる。 */
.tenmei-text-1 { font-size: var(--tenmei-fs-1); line-height: var(--tenmei-lh-2); letter-spacing: var(--tenmei-ls-1); font-weight: var(--tenmei-fw-1); }
.tenmei-text-2 { font-size: var(--tenmei-fs-2); line-height: var(--tenmei-lh-2); letter-spacing: var(--tenmei-ls-1); font-weight: var(--tenmei-fw-1); }
.tenmei-text-3 { font-size: var(--tenmei-fs-3); line-height: var(--tenmei-lh-2); letter-spacing: var(--tenmei-ls-1); font-weight: var(--tenmei-fw-1); }
.tenmei-text-4 { font-size: var(--tenmei-fs-4); line-height: var(--tenmei-lh-3); letter-spacing: var(--tenmei-ls-1); font-weight: var(--tenmei-fw-1); }
.tenmei-text-5 { font-size: var(--tenmei-fs-5); line-height: var(--tenmei-lh-1); letter-spacing: var(--tenmei-ls-2); font-weight: var(--tenmei-fw-2); }
.tenmei-text-6 { font-size: var(--tenmei-fs-6); line-height: var(--tenmei-lh-1); letter-spacing: var(--tenmei-ls-2); font-weight: var(--tenmei-fw-1); }
.tenmei-text-7 { font-size: var(--tenmei-fs-7); line-height: var(--tenmei-lh-1); letter-spacing: var(--tenmei-ls-3); font-weight: var(--tenmei-fw-1); }
.tenmei-fs-1 { font-size: var(--tenmei-fs-1); }
.tenmei-fs-2 { font-size: var(--tenmei-fs-2); }
.tenmei-fs-3 { font-size: var(--tenmei-fs-3); }
.tenmei-fs-4 { font-size: var(--tenmei-fs-4); }
.tenmei-fs-5 { font-size: var(--tenmei-fs-5); }
.tenmei-fs-6 { font-size: var(--tenmei-fs-6); }
.tenmei-fs-7 { font-size: var(--tenmei-fs-7); }
.tenmei-fs-8 { font-size: var(--tenmei-fs-8); }

/* 文字の一部だけ異なる場合は基本の tenmei-text-* の後に追加する。 */
.tenmei-lh-1 { line-height: var(--tenmei-lh-1); }
.tenmei-lh-2 { line-height: var(--tenmei-lh-2); }
.tenmei-lh-3 { line-height: var(--tenmei-lh-3); }
.tenmei-lh-4 { line-height: var(--tenmei-lh-4); }
.tenmei-ls-1 { letter-spacing: var(--tenmei-ls-1); }
.tenmei-ls-2 { letter-spacing: var(--tenmei-ls-2); }
.tenmei-ls-3 { letter-spacing: var(--tenmei-ls-3); }
.tenmei-fw-1 { font-weight: var(--tenmei-fw-1); }
.tenmei-fw-2 { font-weight: var(--tenmei-fw-2); }
.tenmei-font-serif { font-family: var(--tenmei-font-serif); }
.tenmei-font-sans { font-family: var(--tenmei-font-sans); }
.tenmei-align-left { text-align: left; }
.tenmei-align-center { text-align: center; }
.tenmei-align-right { text-align: right; }

/* 余白：各方向は同じ 5 段階の間隔を参照する。 */
.tenmei-mt-0 { margin-top: var(--tenmei-space-0); }
.tenmei-mt-1 { margin-top: var(--tenmei-space-1); }
.tenmei-mt-2 { margin-top: var(--tenmei-space-2); }
.tenmei-mt-3 { margin-top: var(--tenmei-space-3); }
.tenmei-mt-4 { margin-top: var(--tenmei-space-4); }
.tenmei-mt-5 { margin-top: var(--tenmei-space-5); }
.tenmei-mb-0 { margin-bottom: var(--tenmei-space-0); }
.tenmei-mb-1 { margin-bottom: var(--tenmei-space-1); }
.tenmei-mb-2 { margin-bottom: var(--tenmei-space-2); }
.tenmei-mb-3 { margin-bottom: var(--tenmei-space-3); }
.tenmei-mb-4 { margin-bottom: var(--tenmei-space-4); }
.tenmei-mb-5 { margin-bottom: var(--tenmei-space-5); }
.tenmei-ml-1 { margin-left: var(--tenmei-space-1); }
.tenmei-ml-2 { margin-left: var(--tenmei-space-2); }
.tenmei-ml-3 { margin-left: var(--tenmei-space-3); }
.tenmei-ml-4 { margin-left: var(--tenmei-space-4); }
.tenmei-ml-5 { margin-left: var(--tenmei-space-5); }
.tenmei-mr-1 { margin-right: var(--tenmei-space-1); }
.tenmei-mr-2 { margin-right: var(--tenmei-space-2); }
.tenmei-mr-3 { margin-right: var(--tenmei-space-3); }
.tenmei-mr-4 { margin-right: var(--tenmei-space-4); }
.tenmei-mr-5 { margin-right: var(--tenmei-space-5); }
.tenmei-mx-auto { margin-inline: auto; }

.tenmei-p-1 { padding: var(--tenmei-space-1); }
.tenmei-p-2 { padding: var(--tenmei-space-2); }
.tenmei-p-3 { padding: var(--tenmei-space-3); }
.tenmei-p-4 { padding: var(--tenmei-space-4); }
.tenmei-p-5 { padding: var(--tenmei-space-5); }
.tenmei-pt-1 { padding-top: var(--tenmei-space-1); }
.tenmei-pt-2 { padding-top: var(--tenmei-space-2); }
.tenmei-pt-3 { padding-top: var(--tenmei-space-3); }
.tenmei-pt-4 { padding-top: var(--tenmei-space-4); }
.tenmei-pt-5 { padding-top: var(--tenmei-space-5); }
.tenmei-pb-1 { padding-bottom: var(--tenmei-space-1); }
.tenmei-pb-2 { padding-bottom: var(--tenmei-space-2); }
.tenmei-pb-3 { padding-bottom: var(--tenmei-space-3); }
.tenmei-pb-4 { padding-bottom: var(--tenmei-space-4); }
.tenmei-pb-5 { padding-bottom: var(--tenmei-space-5); }
.tenmei-px-1 { padding-inline: var(--tenmei-space-1); }
.tenmei-px-2 { padding-inline: var(--tenmei-space-2); }
.tenmei-px-3 { padding-inline: var(--tenmei-space-3); }
.tenmei-px-4 { padding-inline: var(--tenmei-space-4); }
.tenmei-px-5 { padding-inline: var(--tenmei-space-5); }
.tenmei-py-1 { padding-block: var(--tenmei-space-1); }
.tenmei-py-2 { padding-block: var(--tenmei-space-2); }
.tenmei-py-3 { padding-block: var(--tenmei-space-3); }
.tenmei-py-4 { padding-block: var(--tenmei-space-4); }
.tenmei-py-5 { padding-block: var(--tenmei-space-5); }

.tenmei-gap-1 { gap: var(--tenmei-space-1); }
.tenmei-gap-2 { gap: var(--tenmei-space-2); }
.tenmei-gap-3 { gap: var(--tenmei-space-3); }
.tenmei-gap-4 { gap: var(--tenmei-space-4); }
.tenmei-gap-5 { gap: var(--tenmei-space-5); }

/* 3種類とも「使用幅は100%、上限だけ指定」。中央配置は別クラス。 */
.tenmei-width-1 { width: 100%; max-width: var(--tenmei-width-1); }
.tenmei-width-2 { width: 100%; max-width: var(--tenmei-width-2); }
.tenmei-width-3 { width: 100%; max-width: var(--tenmei-width-3); }
.tenmei-container { width: min(calc(100% - var(--tenmei-page-gutter) - var(--tenmei-page-gutter)), var(--tenmei-width-3)); margin-inline: auto; }

/* 色・背景：背景画像と CTA の個別グラデーションは含めない。 */
.tenmei-color-text { color: var(--tenmei-color-text); }
.tenmei-color-muted { color: var(--tenmei-color-muted); }
.tenmei-color-gold { color: var(--tenmei-color-gold); }
.tenmei-color-gold-deep { color: var(--tenmei-color-gold-deep); }
.tenmei-color-red { color: var(--tenmei-color-red); }
.tenmei-color-white { color: var(--tenmei-color-white); }
.tenmei-bg-white { background-color: var(--tenmei-color-white); }
.tenmei-bg-paper { background-color: var(--tenmei-color-paper); }
.tenmei-bg-panel { background-color: var(--tenmei-color-panel); }
.tenmei-bg-gold { background-color: var(--tenmei-color-gold); }

/* border は太さ・色・solid をまとめて指定する。角丸は基本なし。 */
.tenmei-border-1 { border: var(--tenmei-border-width) solid var(--tenmei-color-border); }
.tenmei-border-2 { border: var(--tenmei-border-width) solid var(--tenmei-color-gold); }
.tenmei-radius-1 { border-radius: 0.2667em; }
.tenmei-shadow-1 { box-shadow: 0 0.4em 0.8em rgb(99 48 13 / 24%); }

/* 表示の基本：各ページの固有レイアウトはここで指定しない。 */
.tenmei-img-fluid { display: block; max-width: 100%; height: auto; }
.tenmei-sp-only { display: none; }

.full-width-img {
  width: 100vw;
  max-width: none;
  margin-left: calc(50% - 50vw);
  display: block;
}

@media (min-width: 751px) and (max-width: 1100px) {
    :root {
        --tenmei-font-size-base: clamp(12px, 1.3636vw, 15px);
    }
}

