/* ローカルフォント「ふい字」の追加 */
@font-face {
    font-family: "HuiFont";
    src: url("./../font/HuiFont29.ttf");
}

/* 背景画像の設定のみ */
body {
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-color: rgba(255, 255, 255, 0.7);
    background-blend-mode: lighten;
}

/* 全てのオブジェクト */
* {
    margin: 0;
    width: auto; height: auto;
    font-family: 'HuiFont';
    font-size: 2vw;
}

/* リンクの色を消す */
a {
    text-decoration: none;
    color: black;
}

/* ウィンドウの領域 */
#window_box {
    margin: 4.444rem 1.388rem 4.444rem 1.388rem;
    list-style: none;
}

/* 全てのウィンドウ */
.window,
#window_box p,
#window_box a {
    width: max-content;
    height: max-content;
    padding: 1.111rem;
    margin-top: auto;
    margin-bottom: auto;
}

/* 一つの会話ウィンドウ */
#window_box div {
    margin: 1.388rem;
    display: flex;
}

/* 表情アイコン */
#window_box > div > img,
.item_window_icon {
    width: 4.444rem; height: 4.444rem;
    margin: 0 1.388rem;
}

/* 小桜のウィンドウ */
.k_window {
    background-color: #FBB;
    box-shadow: 0.277rem 0.277rem 0.138rem rgba(0, 0, 0, 0.25);
    text-align: left;
    margin-left: 0rem;
    margin-right: auto;
}

/* 余白 */
#window_box hr {
    margin: 1.388rem auto;
    border: none;
}

/* 春川のウィンドウ */
.h_window {
    background-color: #BDF;
    box-shadow: 0.277rem 0.277rem 0.138rem rgba(0, 0, 0, 0.25);
    text-align: right;
    margin-left: auto;
}

/* カットイン画像を中央寄せにする領域 */
#window_box > p {
    margin: 0 auto;
}

/* アイテムを獲得した時 */
.get_item {
    background-color: #FFFBBB;
    margin: 1.388rem auto;
}

/* 太文字にする */
.bold_letter {
    text-shadow: 0.02rem 0.02rem 0 black, -0.02rem -0.02rem 0 black,
                -0.02rem 0.02rem 0 black,  0.02rem -0.02rem 0 black,
                       0 0.02rem 0 black,        0 -0.02rem 0 black,
                -0.02rem       0 0 black,  0.02rem        0 0 black;
}

/* 赤文字にする */
.red_letter {
    text-shadow: 0.02rem 0.02rem 0 red, -0.02rem -0.02rem 0 red,
                -0.02rem 0.02rem 0 red,  0.02rem -0.02rem 0 red,
                       0 0.02rem 0 red,        0 -0.02rem 0 red,
                -0.02rem       0 0 red,  0.02rem        0 0 red;
    color: red;
}

/* システムを担当するウィンドウ */
.system_window {
    display: block;
    color: black;
    background-color: #80FF80;
    margin: 1.388rem auto;
    text-align: center;
}

/* 次のサイトに移行するボタンの場合、カーソルを指表示にする */
#next_button {
    cursor: pointer;
    color: white;
    text-shadow: 0.04rem 0.04rem 0 black, -0.04rem -0.04rem 0 black,
                -0.04rem 0.04rem 0 black,  0.04rem -0.04rem 0 black,
                    0    0.04rem 0 black,      0    -0.04rem 0 black,
                -0.04rem    0    0 black,  0.04rem      0    0 black;
}

/* アイテム詳細を調べた時の黒背景 */
#black_background {
    width: 100vw;
    height: 100vh;
    background-color: black;
    opacity: 0;
    display: none;
    position: fixed;
    top: 0;
    left: 0;
}

/* アイテムボタンのウィンドウ */
#item_button_window {
    position: fixed;
    top: 0.5rem;
    right: 1.388rem;
    cursor: pointer;
}

/* アイテムリストのウィンドウ */
ul {
    background-color: #FFFBBB;
    position: fixed;
    border-radius: 1.388rem;
    right: 1.388rem;
}

/* アイテムの名前とアイコン */
li {
    list-style: none;
    display: flex;
    cursor: pointer;
}

/* アイテムリストの名前 */
li p {
    margin: auto 0;
    margin-left: auto;
    background-color: white;
    padding: 0.277rem;
    border-radius: 1.388rem;
}

/* アイテムリストのアイコン領域 */
li > div{
    width: 3.333rem;
    height: 3.333rem;
    background-color: #FFFFFF;
    margin: 0.277rem;
    border: 0.277rem solid black;
    border-radius: 100%;
}

/* アイテムリストのアイコン */
li > div > img{
    width: 3.333rem;
    height: 3.333rem;
    border-radius: 100%;
}

/* アイテム詳細のウィンドウ（共通） */
#item_detail_window_box > div,
#item_detail_window_box_nowhite > div {
    inset: 0;
    width: max-content;
    height: max-content;
    position: fixed;
    margin: auto;
    display: none;
    opacity: 0;
    z-index: 1;
}

/* アイテム詳細のウィンドウ（白背景） */
#item_detail_window_box > div {
    background-color: white;
    border-radius: 1.388rem;
}

/* アイテムのアイコンと会話ウィンドウ*/
.item_message_box {
    width: max-content;
    height: max-content;
    display: flex;
    margin: 1.388rem auto;
}

/* アイテム詳細の名前ウィンドウ */
.item_name {
    background-color: #FFFAAA;
    margin: 1.388rem auto 0 auto;
    border-radius: 1.388rem;
}

/* アイテム詳細の会話ウィンドウ */
.item_message {
    background-color: #FBB;
    margin: auto 1.388rem;
}

/* アイテム詳細の画像 */
.item_img_box > img {
    width: 10rem;
    height: 10rem;
}

/* アイテム詳細の画像を入れるスペース */
.item_img_box {
    width: max-content;
    margin: 0 auto 1.388rem auto;
    display: flex;
}

/* 図書館のMAP 棚ボタンの領域 */
#tmap_button_box {
    display: flex;
}

#manual_1,
#manual_2,
#memo_img {
    height: 25rem;
    width: max-content;
}

/* 図書館のMAP 棚ボタン */
.tana_div {
    background-color: #737373;
    padding: 3.472rem 2.777rem;
    text-align: center;
    border-radius: 1.388rem;
    margin: 1.388rem auto;
}

#tana_link {
    background: #E2A785;
}