@charset 'UTF-8';

/*
COLORS
================================================ */
:root {
    --light-blue: #4db1ec;
    --blue: #1665cc;
    --purple: #b473bf;
    --pink: #ffb2c1;
    --orange: #ff9f67;
    --yellow: #ffd673;
    --light-green: #a2e29b;
    --green: #00a2af;
    --grey: #333;
    --white: #fff;
    --light-gray: #e6e6e6;
    --gray: #666666;
    --darkred: #8b0000;
    --m-silver: #999B9B;
    --karatya: #8d6449;
    --kuriiro: #554738;
    --ivory: #f8f4e6;
    --urumi: #e9dacb;
    --akasumi: #3f312b;
}

/*
GENERAL STYLING
================================================ */
html {
    font-size: 100%;
    /* スムーズスクロール */
    scroll-behavior: smooth;
}
body {
    color: var(--grey);
    background-color: var(--ivory);
}

.grid {
    display: grid;
    gap: 1rem;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}

img {
    width: 100%;
    height: 240px;
    object-fit: cover;
}

.kosugi-maru-regular {
  font-family: "Kosugi Maru", sans-serif;
}

/*
MEKKI GAZO
================================================ */

li {
    margin-left: 0rem;
    padding: 0.5rem;
    font-family: "Kosugi Maru", sans-serif;
}

li[class~="nickel"] {
    background: #A8A9AD;
}

li[class~="crome"] {
    background: #a9a9a9;
}

li[class~="white"] {
    background: #b0c4de;
}

li[class~="black"] {
    background: #000000;
}

li[class~="yellow"] {
    background: #FFD700;
}

li[class~="suzu"] {
    background: #696969;
}

li[class~="mudenkai"] {
    background:#f5f5f5;
}