/*　このファイルは Home.razor以外のAbout, Contact, Privacy.razor用に作成した。　　*/
/* 1. 全体の基本設定（ベース） */
.document-page-body {
    font-family: 'Helvetica Neue', Arial, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo, sans-serif;
    line-height: 1.8;
    color: #333333;
    max-width: 800px;
    margin: 0 auto;
    padding: 10px 20px 40px 20px; /* 上部ツールバーとの被り防止 */
}

    /* 2. 見出し自体の基本デザイン */
    .document-page-body h1 {
        font-size: 2rem;
        border-bottom: 3px solid #333333;
        padding-bottom: 10px;
/*        margin-top: 40px;*/
        margin-bottom: 20px;
    }

    .document-page-body h2 {
        font-size: 1.6rem;
        border-left: 5px solid #0066cc;
        padding-left: 15px;
        margin-top: 35px;
        margin-bottom: 15px;
    }

    .document-page-body h3 {
        font-size: 1.25rem;
        color: #555555;
        margin-top: 30px;
        margin-bottom: 12px;
    }

    /* 3. 【重要】見出しグループ内（.section）の本文を一律20pxインデント */
    .document-page-body .section p,
    .document-page-body .section ol,
    .document-page-body .section table {
        padding-left: 20px; /* H1, H2, H3に関わらず一律で20px右に寄せる */
    }

    /* 4. 各要素の共通デザイン（余白や装飾） */
    .document-page-body p {
        font-size: 1rem;
        margin-top: 0;
        margin-bottom: 1.5rem;
        text-align: justify;
    }

    .document-page-body ol {
        margin-top: 0;
        margin-bottom: 1.5rem;
    }

        .document-page-body ol li {
            font-size: 1rem;
            margin-bottom: 8px;
        }

    /* テーブルの標準デザイン */
    .document-page-body table {
        width: 100%;
        margin-top: 0;
        margin-bottom: 1.5rem;
        border-collapse: collapse;
    }

        .document-page-body table th,
        .document-page-body table td {
            border: 1px solid #cccccc;
            padding: 8px 12px;
            text-align: left;
        }

        .document-page-body table th {
            background-color: #f5f5f5;
        }