@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Kiwi+Maru&family=Kosugi+Maru&family=Varela+Round&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Flow+Circular&family=Kiwi+Maru&family=Kosugi+Maru&display=swap');

*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }
html {
    font-size: 62.5%;
    scroll-behavior: smooth;
    scroll-padding-top: 32px;
}
body{
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-family: sans-serif;
    font-size: 1.6rem;
    line-height: 1.5;
    font-weight: 500;
    color: var(--textColor);
}
img,video,iframe{
    max-width: 100%;
    height: auto;
}
img{
    vertical-align: top;
}
::selection{
    background-color: #ffe26183;
}
summary {
    display: block;
    border: none;
    cursor: pointer;
}
summary::-webkit-details-marker {
    display: none;
}


*{
    font-weight: 500;
    line-height: 1.65em;
    letter-spacing: .15em;
}
li{list-style: none;}

:root{
    --bg: #fefefe;
    --bgA: rgba(255, 255, 255, 0.65);
    --bgA2:#ffffffcc;
    --text: #7b7b7b;
    --textL: #a1a1a1;
    --sub: rgb(214, 214, 214);
    --subDX: rgb(195, 195, 195);
    --subL: rgb(243, 243, 243);
    --subLL: rgb(248,248,248);
    --kiiro: #ffe07c;
    --pink: #ffcdc6;
    --blue:#cae4f3;

    --border: var(--sub) 1px solid;
    --br_small: 8px;
    --br: 12px;
    --br_big: 16px;

    --font:'ヒラギノ角ゴシック','Hiragino Sans','Menlo','メイリオ', Meiryo ,sans-serif;
}

/*----------------ダークモード----------------------*/
@media (prefers-color-scheme: dark) {
    :root{
        --bg: rgb(89, 88, 87);
        --bgA: rgba(89, 88, 87, 0.65);
        --bgA2:rgba(89, 88, 87, .85);
        --text: rgb(245, 244, 244);
        --textL: rgb(243, 243, 243);
        --sub: rgb(173, 173, 173);
        --subDX: rgb(186, 186, 186);
        --subL: rgb(129, 129, 129);
        --subLL: rgb(101, 101, 101);
        --kiiro: #d7c179;
        --pink: #d6aca6;
        --blue:#a7bdc9;
    }
    img{
        filter: opacity(.9);
    }
}
/*------------------------------------------------*/
body{
    color: var(--text);
    font-family: var(--font);
    background: var(--bg);
}