*,*:before,*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box;box-sizing:border-box;margin:0}

html, body {
	width: 100%;
	min-height:100vh;
	margin: 0;
	padding: 0;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-moz-font-feature-settings: "liga", "kern";
}
html {
	font-size: 100%;
	scroll-behavior: smooth;
}
body {
	-webkit-overflow-scrolling: touch;
    font-family: system, -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Helvetica", "Myriad Set Pro", "Lucida Grande", "Lucida Sans Unicode", "Arial", "Verdana", "sans-serif";
	background: #FFFFFE;
	height: 100%;

	color: #777776;
	line-height: 1.7857;
	font-weight: 200;
	font-style: normal;
	font-size: 100%;
	-ms-text-size-adjust: 100%;
	-webkit-text-size-adjust: 100%;
	margin: 0 auto;
	min-width: 320px;
	padding: 0;
	position: relative;

	display: flex;
	flex-direction: column;
	gap: 4em;
}

a, a:active, a:hover, a:visited {
	/* color: #17458f; */
	color: inherit;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

#footer {
	clear: both;
	position: relative;
	color: #a7a7a7;
	font-size: 1.25em;
	line-height: 2;
	padding: 0 2%;
	font-weight: 400;

	z-index: 0;
	flex-shrink: 0;
    max-width: 2560px;
    margin: 0 auto;
    width: 100%;

    text-align: right;
}

#footer a::before {
	font-family: 'icomoon';
	speak: none;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	font-size: .85em;
	position: relative;
	left: 0;
	top: 0;
	line-height: 1;
}
#footer nav {
	display: inline-block;
}
#footer nav a span {
	padding-left: .4ch;
}
#footer nav a span {
	display: none;
}
#footer a.sns-facebook::before {
	content: "\e926";
}
#footer a.sns-instagram::before {
	content: "\e92b";
}
#footer a[href="legal"]::before {
    content: "\e908";
}
#footer a[href="contact"]::before {
	content: "\e90c";
}

#debug {
	z-index: 10;
}
#debug > summary {
	text-align: center;
	margin-top: -1.7em;
	cursor: pointer;
}
#debug dt {
	float: left;
	margin-right: 1em;
}
#debug dd {
	display: table;
	background: lightgrey;
	color: #fff;
	margin: .1em;
	padding: 0 .4em;
	border-radius: 5px;
}

.skip-link {
	background: white;
	color: #000;
	font-weight: 700;
	left: 50%;
	padding: .5em 1em;
	position: fixed;
	transform: translateX(-50%) translateY(-100%);
	transition: transform .25s, opacity .3s;
	z-index: 99999999999;
	border: 1px solid grey;
	border-radius: 10%/50%;
	margin: 1em 0 0;
	opacity: 0;
}
.skip-link:focus-within {
	transform: translateX(-50%) translateY(0%);
	opacity: 1;
}
.skip-link:focus-within ~ #header::before {
	content: "";
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: rgba(0,0,0,.5);
	z-index: 999999;
}
.skip-link a:focus {
	outline: auto;
	text-decoration: underline;
}