/* 色 */
:root {
    --body-bgcolor: #fff7f7;
    --body-text: #333;
    --a: #A60000;
    /* --mainbg: linear-gradient(rgba(15, 104, 19, 0.527), rgba(255, 102, 0, 0.5)),url(#); */
    /* colom */
    --colombg: #fff;
    --colomborder: #fff;
    /* 強調 */
    --strongbg: #fff7b0;
    --strongtext: #333;
    --strongacolor: #A60000;
    /* h */
    --h1text: #164228;
    --h1bgcolor: #b4cb9d;
    --h2text: #333;
    --h3text: #333;
}



/* 基本 */
body {
    margin: 0;
    font-size: 0.8em;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    background-color: var(--body-bgcolor);
    color: var(--body-text);
    line-height: 1.5rem;
    font-family:'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
}
body:before{
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    /* background: url("https://ocuid.witchserver.jp/img/bg.jpg") center no-repeat; */
    background-size: cover;
}
a {color: var(--a);text-decoration: none;}
main {
    max-width: 800px;
    margin: 15px auto;
    background-image: var(--mainbg);
}
.copyright {font-size: 0.5em;}
.space {padding: 20px;}


/* カラム */
section {margin: 0px 10px 25px 10px;}
.mainflex {display: flex;}
.colom1 {max-width: 100%;}
.colom1,.colom2,.colom_enter {
    margin: 10px;
    padding: 20px;
    /* background-color: var(--colombg); */
    border: 1px solid #A60000;
    border-right-color: #A60000;
    border-bottom-color: #A60000;
    border-radius: 20px;
    backdrop-filter: blur(12px);
}
.colom1,.colom2 {box-shadow: 0 0 10px -3px var(--colomshadow);}
.colom_enter {box-shadow: 0 0 10px -3px var(--colom_entershadow);}

.flex {display: flex;}
.space {padding: 20px;}
.box {width: 100%;display: flex;flex-direction: row;flex-wrap: wrap;}
.mainmenu {padding: 0.5em;}
.banner {padding: 0.2em;}
strong {
    background-color: var(--strongbg);
    color: var(--strongtext);
    margin: 2px;
    padding: 1px 5px 1px 5px;}
    strong a {color: var(--strongacolor);}
small {padding-left: 1em;font-size: 0.6em;}

/* h */
h1 {
    font-size: 35px;
    font-family: "Kaisei Opti", serif;
    color: var(--h1text);
    position: relative;
    background-color: var(--h1bgcolor);
    box-shadow: 0px 0px 0px 5px var(--h1bgcolor);
    border: dashed 2px var(--h1text);
    padding: 0.2em 0.5em;
}
h1 ::after {
    position: absolute;
    content: '';
    left: -7px;
    top: -7px;
    border-width: 0 0 30px 15px;
    border-style: solid;
    border-color: var(--body-bgcolor) var(--body-bgcolor) var(--h1text);
    box-shadow: 1px 1px 1px var(--h1bgcolor);
}
h1 span {
    font-size: 0.4em;
    display: flex;
    padding: 0.8em 2em;
}
h2 {
    font-size: 20px;
    color: var(--h2text);
    border-bottom: double var(--h2text);
    margin-bottom: 0.5em;
}
h2 span {
    font-size: 15px;
    margin: 10px;
    padding-left: 1em;
}
h3 {color: var(--h3text);margin-bottom: 0.5em;}

/* 画像 */
.worksimg {max-width: 100%;}
.gallery {display: flex;flex-wrap: wrap;justify-content: start;gap: 2%}
.gallery img {width: 75px;height: 75px;object-fit: cover;border-radius: 30%;}
.filter{filter: blur(1.5px);}

/* リスト */
li {list-style: none;padding-left: 10px 0 10px 0;}

/* sitemap */
.sitemap .sitemap_list {display: flex;justify-content: flex-start;}
.sitemap .sitemap_list dt {width: 90px;padding: 3px;text-align: left;font-weight: bold;}
.sitemap .sitemap_list dd {width: 80%;padding: 3px;text-align: left;}

/* アコーディオンメニュー */
.summary {font-size: 16px;margin: 25px 0;}
.summary span {margin-left: 15px;font-size: 10px;}
.netabare {font-size: 12px;font-weight: bold;border-bottom: 1px dotted;margin: 10px 0;}
.summaryh3 {font-size: 13px;font-weight: bold;padding: 1em;}
.summaryh3 span {padding: 0 0 25px 25px;font-size: 10px;}

/* スマホ */
@media screen and (max-width: 756px){
    .menu {font-size: 12px;}
    .hmbox {flex-direction: column;}

    /* カラム */
    .mainflex {display: block;}
    .colom1,.colom2,.colom_enter {width: 80%;}
    .margin-bottom{margin-bottom: 25px;}
    /* ギャラリー */
    .gallery img {width: 60px;height: 60px;}
    /* 同人誌 */
    .hmbook {width: 85%;margin: 20px;padding: 5px 5px;}
    .hmbookboxflex {display: grid;}
    .hmbookflex {display: flex;}
    .hmbook p {text-align: left;padding: 0.2em;}
    .hmbook a {display: block;padding: 0.5em;}
    .bookimg {width: 120px;padding: 5px 5px;}
}

/* てがろぐ */
.tega_day {
    font-weight: bold;
    padding-right: 1em;
}