@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=Libre+Baskerville:wght@400;700&family=Noto+Sans+JP:wght@400;500;700;900&family=Noto+Serif+JP:wght@200;300;400;500;600;700;900&display=swap");
@import url("root.css");


/* style */
* {margin:0; padding:0;}
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, img, small,
strong, dl, dt, dd, ol, ul, li, form, label, table, caption, tr, th, td, article, aside, 
footer, header, nav, section, audio, video {font-size:100%; vertical-align:baseline; border:0; outline:0; background:transparent;}
article, aside, footer, header, nav, section, a, label {display:block;}
html, body {width:100%; height:100%;}
html {font-size:10px; overflow-y:scroll;}
body {color:var(--color); font-size:1.2rem; font-weight:400; font-family:"Lato", "Noto Sans JP", sans-serif; letter-spacing:0.1em; opacity:0; background:var(--bg); transition:all 0.3s ease-in-out;}
body.fixed {position:fixed;}
h1, h2, h3, h4, h5 {font-weight:normal;}
video, iframe {vertical-align:top;}
ol, ul {list-style:none;}
img {width:100%; height:auto; vertical-align:top;}
a {color:var(--link-color); text-decoration:none;}


@media screen and (min-width:768px) {
	body {font-size:1.4rem;}
}


@media screen and (min-width:1024px) {
	a {transition:all 0.3s ease-in-out;}
	a:hover {opacity:0.3;}
}



/* coming */
#coming {
	width:100%;
	height:100%;
	display:flex;
	justify-content:center;
	align-items:center;
}

#coming .soon {
	font-weight:700;
	font-family:"Libre Baskerville", "Noto Serif JP", serif !important;
	text-align:center;
}

#coming h1 {width:88px;}

#coming p {margin-top:8px;}


@media screen and (min-width:768px) {
	#coming h1 {width:150px;}

	#coming p {margin-top:16px;}
}