/* common.css */

/* ========================================
   全体設定
======================================== */
:root {
    --color-bg: #ffffff;
    --color-text: #1a1a1a;
    --color-text-sub: #555555;
    --color-border: #d8d2c8;
    --font-jp: 'Shippori Mincho', 'Yu Mincho', 'YuMincho', '游明朝', serif;
    --font-en: 'Shippori Mincho', 'Yu Mincho', 'YuMincho', '游明朝', serif;
    --container-width: 680px;
    --container-padding: 40px;
}

html {
    font-size: 16px;
    scroll-behavior: smooth;
}

body {
    background-color: var(--color-bg);
    color: var(--color-text);
    font-family: var(--font-jp);
    line-height: 1.8;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ========================================
   コンテナ
======================================== */
.l-container {
    max-width: var(--container-width);
    margin: 0 auto;
    padding: 0 var(--container-padding);
}

/* ========================================
   ヘッダー（このティザーでは非表示）
======================================== */
.l-header {
    display: none;
}

/* ========================================
   フッター
======================================== */
.l-footer {
    padding: 40px;
    text-align: center;
}

.l-footer__copy {
    font-family: var(--font-en);
    font-size: 0.6875rem;
    letter-spacing: 0.15em;
    color: var(--color-text-sub);
}

/* ========================================
   レスポンシブ
======================================== */
@media screen and (max-width: 768px) {
    :root {
        --container-padding: 24px;
    }

    .l-footer {
        padding: 32px 24px;
    }
}
