body {
    margin: 0;
    padding: 20px 0;

    background-color: #dcdcec;

    color: #333366;

    font-family:
        "ＭＳ Ｐゴシック",
        "MS PGothic",
        sans-serif;

    font-size: 14px;
}

#wrapper {
    width: 780px;
    margin: 0 auto;

    background-color: #ffffff;

    border: 3px ridge #aaaacc;
    box-shadow: 3px 3px 0 #888899;
}

/* ヘッダー */

header {
    padding: 12px 10px;

    text-align: center;

    background-color: #eeeeff;

    background-image: linear-gradient(
        to bottom,
        #ffffff,
        #ccccdd
    );

    border-bottom: 2px solid #777799;
}

header h1 {
    margin: 0;

    color: #333399;

    font-size: 28px;

    text-shadow: 1px 1px #ffffff;
}

.subtitle {
    margin: 5px 0 0;

    color: #666688;
}

/* ナビゲーション */

nav {
    padding: 7px;

    text-align: center;

    background-color: #ddddee;

    border-bottom: 1px solid #9999bb;
}

nav a {
    margin: 0 8px;

    color: #0000cc;

    font-weight: bold;

    text-decoration: underline;
}

nav a:visited {
    color: #660099;
}

nav a:hover {
    color: #ff0000;
}

/* メイン */

main {
    padding: 15px 25px;
}

/* 各コーナー */

section {
    margin-bottom: 20px;

    background-color: #fafaff;

    border: 1px solid #9999bb;
}

section h2 {
    margin: 0;
    padding: 5px 10px;

    color: #ffffff;

    background-color: #666699;

    border-bottom: 2px solid #333366;

    font-size: 16px;
}

section > p,
section > ul {
    margin: 12px;
}

/* プロフィール */

.profile {
    display: flex;

    gap: 20px;

    padding: 15px;
}

.profile img {
    width: 180px;
    height: auto;

    padding: 3px;

    background-color: #ffffff;

    border: 3px double #777799;
}

.profile-text {
    line-height: 1.8;
}

/* リンク */

a {
    color: #0000cc;
}

a:visited {
    color: #660099;
}

a:hover {
    color: #ff0000;
}

/* 注意書き */

.notice {
    background-color: #ffffee;

    border: 1px dashed #999999;

    color: #666666;

    font-size: 11px;
}

/* フッター */

footer {
    padding: 10px;

    text-align: center;

    background-color: #eeeeff;

    border-top: 2px solid #9999bb;

    color: #666666;

    font-size: 11px;
}

.counter {
    padding: 2px 5px;

    background-color: #eeeeee;

    border: 1px inset #999999;

    color: #000000;

    font-family: monospace;
}
/* 日記 */

.diary-entry {
    margin-bottom: 20px;
}

.diary-entry h2 {
    font-size: 15px;
}

.diary-title {
    margin: 12px;
    padding: 5px 8px;

    color: #333399;
    font-weight: bold;

    border-bottom: 1px dotted #9999bb;
}

.diary-body {
    padding: 0 12px 8px;
    line-height: 1.9;
    font-size: 15px;
}

.diary-body p {
    margin: 0 0 1em;
}

.diary-nav {
    margin-top: 25px;
    padding: 8px;

    border: 1px dashed #9999bb;
    background-color: #eeeeff;
}