@charset "utf-8";

/* http://meyerweb.com/eric/tools/css/reset/
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*
フォント "dekisokonaifont_plus" は "できそこないフォント" のかな・英数・記号類と、 "美咲ゴシック第2" の漢字・記号類をミックスしたものです。
元フォントは、どちらもフリーフォントですが、著作権はそれぞれのフォントの作者にあります。
また "できそこないフォント" については作者の意向により、再配布が禁止されています。
Webフォントとして利用させていたただいている以上、ファイルは公開されていますが、
(!) フォントファイルそのもののダウンロードはお控えください。

The font “dekisokonaifont_plus” is a mix of Kana, alphanumeric and symbols from “dekisokonaifont” and Kanji and symbols from “MisakiGothic2nd”.
Both fonts are free fonts, but copyrights are held by their respective authors.
Redistribution of the “dekisokonaifont” is prohibited by the author.
However, as long as the fonts are used as Web fonts, the files are publicly available,
(!) Please do not download font files.

dekisokonaifont
http://www.rain-road.com/font/
copyright (C)2011 rain-road.

MisakiGothic2nd
https://littlelimit.net/misaki.htm
Copyright (C) 2002-2021 Num Kadoma
*/
@font-face {
    font-family: dekisokonaifont_plus;
    src: url('../../assets/fonts/dekisokonaifont_plus.ttf') format('truetype');
    src: url('../../assets/fonts/dekisokonaifont_plus.woff') format('woff');
    src: url('../../assets/fonts/dekisokonaifont_plus.woff2') format('woff2');
}

#room {
    display: flex;
    flex-direction: column; /* 要素を縦に並べる */
    justify-content: center; /* 上下中央揃え */
    align-items: center; /* 左右中央揃え */
    width: 100%;
    min-height: 100vh;
}

#debug-info {
    position: absolute;
    top: 0;
    left: 0;
    font-family: dekisokonaifont_plus;
    color: rgba(32, 32, 32, .2);
    font-size: 16px;
}

#title {
    font-size: 64px;
    font-family: dekisokonaifont_plus;
}

#txt, #link {
    font-size: 16px;
    font-family: dekisokonaifont_plus;
    margin-bottom: 10px;
}

a {
    color: #e76a16;
}

#copyright {
    position: absolute;
    bottom: 0;
    left: 0;
    font-size: 16px;
    font-family: dekisokonaifont_plus;
    color: rgba(32, 32, 32, .2);
}

#rapo_body {
    position: absolute;
    bottom: 32px;
    width: 128px;
    height: calc(256px - 32px);
    background-image: url('../../assets/images/rapo_42709018.png');
    background-size: 512px 512px;
    image-rendering: pixelated;
    background-position: 0 0;
}

#rapo_face {
    position: absolute;
    bottom: 32px;
    width: 128px;
    height: calc(256px - 32px);
    background-image: url('../../assets/images/rapo_42709018.png');
    background-size: 512px 512px;
    image-rendering: pixelated;
    background-position: 0 -256px;
}

#rapo_foot {
    position: absolute;
    bottom: 0px;
    width: 128px;
    height: 32px;
    background-image: url('../../assets/images/rapo_42709018.png');
    background-size: 512px 512px;
    image-rendering: pixelated;
    background-position: 0 calc(256px + 32px);
}