body, html { padding: 0; margin: 0; height: 100%; }
body {
    display: flex;
    flex-direction: column;

    background-color: var(--c-light);
    color: var(--c-dark);
}

#logo {
    height: fit-content;
    display: flex;
    align-items: center;
    border-radius: calc(var(--radius) / 5);

    margin: auto 0;
    gap: 0.3em;
    padding: 0;
}

#logo img {
    height: 1.2em;
    background-color: var(--c-green);
    padding: 0.3em;
    border-radius: calc(var(--radius) / 5);
}

#logo p {
    font-size: 1.25em;
    font-weight: bold;
    color: var(--c-dark3);
    margin-top: -0.125em;
}

#logo:hover,
#logo:active,
#logo:focus-visible {
	filter: brightness(130%) saturate(50%);
}

nav {
    position: fixed;
    top: 0; left: 0; right: 0;

    z-index: 9999;
	max-height: var(--nav-max-height);
}



nav-content {
	display: block;
    background-color: var(--c-white);
	box-shadow: var(--float-shadow);
}

body > tetsu-container:first-of-type {
    margin-top: 6.5rem;
}

nav-content > tetsu-container,
nav-middle {
    display: flex;
    justify-content: space-between;
    column-gap: 0.5em;
}

nav-head {
    display: flex;
    justify-content: space-between;
    min-width: 2em;
}
nav-head a:last-child { display: none; }

nav-head,
nav-last { 
	flex: 1 0 calc(var(--rvh) * 6);
}

nav-middle {
	flex: 0.25 0 auto;
}

nav-last {
	display: flex;
	justify-content: flex-end;
}

nav a {
    padding: 0.8em 0;

    font-size: var(--f-l1);
    color: var(--c-green);
    text-decoration: none;
    text-wrap: nowrap;
}

#mobile_menu_btn img {
	height: 1em;
	border-radius: unset;
}

@media (max-width: 48em) {
    nav-head > a > p {
		display: none;
	}
}

@media (max-width: 35em) {
    nav-middle,
	nav-last {
        display: none;
    }
    nav-head a:last-child { display: block; }
}

/* MOB */
#mobile_nav div {
	padding: 0 1em;
}
#mobile_nav a {
	display: block;
	text-align: center;
	font-size: var(--f-l2);
}

tetsu-empty {
    flex-grow: 1;
}

footer {
    margin: 3rem 0 1rem 0;
}

tetsu-empty + footer {
	margin-top: var(--v-gap);
}

footer tetsu-float {
    display: flex;
    justify-content: center;
}
footer tetsu-float > footer-link:not(:last-child)::after {
    content: "";
    border-right: 1px solid var(--c-dark3);
    margin: 0px min(2em, 2vw);
}
footer tetsu-float a {
    text-wrap: nowrap;
}

footer tetsu-float + p {
	margin: 1em 0 0.5em 0;
	text-align: center;
}
@media (max-width: 600px) {
    footer tetsu-float { flex-direction: column; align-items: center; gap: 0.5em; }
    footer footer-link::after { content:unset !important; }
}

/* #info_list */
/* エラー、成功メッセージの一覧 */
info-div {
    position: relative;
    display: block;
    width: 100%;
}
info-div:not([ready]) {
	visibility: hidden;
}
info-div > #info_list {
    position: absolute;
    top: 0; left: 0; right: 0;

    display: flex;
    flex-direction: column;
}

info-div > *,
info-div > info-list > * {
	margin-top: 0.5em;
}