@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;400;700&display=swap');

:root {
    --link-black-color: #333333;
    --header-background-color: rgba(147,161,173,0.375);
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    background-color: white;
    color: #111111;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

header {
    background-color: var(--header-background-color);
    background-image: url('img/ReUdo_powerd_by_EBELONG.svg');
    background-position: right top;
    background-repeat: no-repeat;
    background-size: auto 3rem;
    min-height: 3rem;
    padding-left: 0.5em;
    padding-right: 0.5em;
}

header nav > dl {
    margin: 0;
    padding-bottom: 1ex;
}
header nav > dl > dt {
    font-weight: bolder;
    font-size: larger;
}
header nav > dl > dd {
}
header nav a {
    color: var(--link-black-color);
}
header nav a:active,
header nav a:hover {
    color: inherit;
    font-weight: bolder;
}

main {
    flex-grow: 1;
    margin-left: 0.75rem;
    margin-right: 0.75rem;
}
main > section {
    counter-reset: notecount;
}
main > section > h1 {
    font-size: x-larger;
    font-weight: bold;
    margin-top: 1ex;
    margin-bottom: 1ex;
    padding-top: 1ex;
    text-shadow: var(--header-background-color) 0 0 16px;
}
main > section > h1 + * {
    margin-top: 1ex;
}
main > section h2 {
    font-size: large;
    font-weight: bold;
}

main > section > section > h3 {
    margin-bottom: 0.25ex;
}
main > section > section > h3 + * {
    margin-top: 0;
    margin-left: 1rem;
    font-size: 95%;
}

main > section > dl > dt {
    margin-top: 1ex;
}
main > section > dl > dd {
    font-size: 95%;
}
main > section > * > li > .subtitle + * {
    font-size: 95%;
}
footer {
    background-color: var(--header-background-color);
    background-image: url('img/REUDO-logo.png');
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: auto 2rem;
    min-height: 2rem;
    padding-left: 0.5em;
    padding-right: 0.5em;
}
footer > * {
    text-align: right;
}
footer a {
    color: var(--link-black-color);
}
footer a:active:not([href^="mailto:"]),
footer a:hover:not([href^="mailto:"]) {
    color: inherit;
    font-weight: bolder;
}

.notice {
    font-size: 110%;
    line-height: 150%;
}

.detail {
    font-size: smaller;
}

dd {
    margin-left: 1em;
}
ul {
    padding-left: 2em;
}
dd > dl,
dd > ul,
dd > ol,
li > dl,
li > ul,
li > ol {
    margin-top: 0;
    margin-bottom: 0;
}

dt > .subtitle,
dd > .subtitle,
li > .subtitle {
    display: block;
    font-weight: bolder;
    margin-top: 0.5rem;
}

p.gotop {
    font-size: smaller;
    text-align: center;
}

sup.note {
    font-size: smaller;
}
sup.note::before {
    content: "[※";
}
sup.note::after {
    content: "]";
}
span.note {
    counter-increment: notecount;
}
span.note::after {
    content: "[※"counter(notecount)"]";
    vertical-align: super;
    font-size: smaller;
}
ol.note {
    list-style: none;
    padding-left: 0;
    counter-reset: notecount;
}
ol.note > li {
    counter-increment: notecount;
}
ol.note > li::before {
    font-size: smaller;
    vertical-align: top;
    content: "[※"counter(notecount)"] ";
}

a[href*="www.amazon.co.jp/"] {
    background-image: url('/rsrc/img/Available_At_Amazon_JP/available_at_amazon_rgb_jp_vertical_drk.png');
    background-repeat: no-repeat;
    background-position: right center;
    background-size: 2.4rem auto;
    padding-right: 2.4rem;
}    

@media (min-width: calc(36rem + 120px)), print {
    header nav > dl {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: center;
	padding-top: 1ex;
    }
    header nav > dl > dd {
	margin-left: 1rem;
    }

    body > main {
	margin-left: auto;
	margin-right: auto;
	min-width: 40rem;
	max-width: calc(100% - 5rem);
    }
}

@media print {
    header,
    footer,
    body > section,
    dt, dd, li, table {
	break-inside: avoid-page;
    }
    h1, h2, h3 {
	break-after: avoid-page;
    }
    dd {
	break-before: avoid-page;
    }
    div.videobox,
    nav a,
    p.gotop {
	display: none;
    }
}