@charset "utf-8";

pre{font-size:100%;
    word-break: break-all;
white-space: pre-wrap ;
}


img {
    max-width: 100%;
    height: auto;
}

a {

    color: #5A708A;
    text-decoration: none;
}

a:link {
    color: #3C4A5D;
    text-decoration: none;
}

a:visited {
    color: #C4B09D;
    text-decoration: none;
}

a:hover {
    text-decoration: none;
    color: #98B6D1;
    position: relative;
    top: 1pt;
    left: 1pt;
}


/*サイト名*/

.title {
    text-align: center;
    font-family: 'Abel', sans-serif;
    font-size: 150%;
}

/* topmenu */

ul.menu {
    padding-left: 0px;
    display: flex;
    justify-content: center;
    font-family: 'Abel', sans-serif;
    flex-wrap: wrap;/*折り返す*/
}

.menu li {
    background-color: #3C4A5D;
    color: azure;
    margin: 5px;
    list-style-type: none;
    border-radius: 5px;

}

.menu li a {
    background-color: transparent;
    color: #C4B09D;
    text-decoration: none;
    border-bottom: 0px;
    font-size: 120%;
    display: block;
    padding: 0px 15px;
    background: url() center center;

}

/*ジャンルリスト*/

ul.textlist {
    padding: 0;
    position: relative;
    border: 1px dashed #C4B09D;
    /*周りの枠線*/
    border-radius: 5px;

}

ul.textlist li {
    color: white;
    background: transparent;
    line-height: 1.5;
    border-bottom: 1px dashed #C4B09D;
    list-style-type: none !important;
}

ul.textlist li:before {
    /*疑似要素*/
    content: url(img/leaf.png);
    /*左のマーク*/
    position: absolute;
    color: #C4B09D;
    /*アイコン色*/
    display: inline-block;
    margin: 0.5em;
    /*アイコンの位置微調整*/
    width: 1em;
    /*アイコンの幅*/
    height: 1em;
    background: url() no-repeat;
    /*アイコンのURL*/
    background-size: contain;
}

ul.textlist li:last-of-type {
    border-bottom: none;
    /*最後のliの線だけ消す*/
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    /*下だけ丸くする*/
}

ul.textlist li:first-of-type {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    /*最初だけ丸くする*/
}

.textlist li a {
    padding: 0.5em 0.5em 0.5em 2em;
    text-decoration: none;
    border-bottom: 0px;
    display: block;
    /*これで全部をリンクにしてる*/
    max-width: 100%;
    background-color: transparent;
    background: url() center center;
}





/*pで囲ってリンクを横並び*/

p.longtxt {
    display: flex;
    justify-content: center;
    /*真ん中に寄せる*/
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 70%;
    /*折り返す*/
    margin: auto;
}

p.longtxt a {
    padding: 8px 15px;
    border: solid 1px #C4B09D;
    border-radius: 20%;
    margin: 0px 0.15em 0.5em 0px;
    background: #fff;
}

/*連載の次へボタン*/
div.tugi {
    justify-content: center;
    display: flex;
}
div.tugi a{
              color: #3C4A5D;
        padding: 5px 10px;
        border: solid 1px #3C4A5D;
        border-radius: 10px;
        margin: 1em;
        background: #fff;
}


/*短編を綺麗に並べる、説明もつける*/


.all section ul {list-style: none;
    margin:0em;
    margin-bottom: 1em;
padding-left: 1.5em;}
.all section li {
        border-left: dotted 1px #ccc;
    padding-left: 0.4em;
    display: inline;
} 

.all section li:first-of-type {
            border-left: dotted 0px #ccc;
    padding-left: 0em;
    display: inline;}

/*リンクの背景*/

.all a {
    padding: 3px;
    background: url(img/bg.jpg) center center;
    background-size: 150px;
    font-size: 105%;
    border: none;
    font-family: 'Abel', cursive;
}

 h3 {
    margin: 0px;
    color: #5A708A;
    padding: 0em;
    font-size: 120%;
    font-weight: normal;
    border-left: #a0d8ef 10px;
    font-family: 'Abel', sans-serif;

}
h3:first-letter {padding: 0px;
    margin: inherit;
    font-size: 140%;
    color: #325A8C;
}


 h4 {background:url() bottom repeat-x transparent;
background-size: 5px;
    margin: 0px;

    color: #5A708A;
    padding: 0em;
    font-size: 120%;
    font-weight: normal;
    border-left: solid #E9F8FA 5px;
    font-family: 'Abel', sans-serif;
     position: relative;

}


/*更新履歴*/
iframe {
border: 1px #C4B09D solid;
    min-width:100%;
    height:140px;
}
 .news {
        font-family: "HiraMinProN-W3", "游ゴシック Medium", "Yu Gothic Medium", 'メイリオ', Verdana, Arial, Osaka, Helvetica, sans-serif;
        text-align: left;
        padding: 0.3em;
        margin: 0em;
        background: transparent url() no-repeat left bottom;
        border: solid #adb3c9 0px;
     font-size: 90%;
    }
/*リンクの背景*/

.news a {
    padding: 3px;
    background: url(img/bg.jpg) center center;
    background-size: 150px;
    font-size: 105%;
    border: none;
    font-family: 'Abel', cursive;

}
.news p {
margin:0; 
padding:0.5em 0 1.5em 1em; 
line-height:;
}






/*ちいさい画面*/
@media screen and (max-width:380px) {

    body {
        color: #333;
        word-wrap: break-word;
        overflow-wrap: break-word;
        text-align: left;
        line-height: 1.8;
        letter-spacing: 1px;
        font-size: 98%;
        
    }


    body.news { /*更新履歴のbodyだけ変える*/
        word-wrap: break-word;
        overflow-wrap: break-word;
        text-align: left;
        line-height: 1.8;
        letter-spacing: 1px;
        font-size: 96%;
    }
    
    
    .all {
        font-family: "HiraMinProN-W3", "游ゴシック Medium", "Yu Gothic Medium", 'メイリオ', Verdana, Arial, Osaka, Helvetica, sans-serif;
        text-align: left;
        padding: 1.3em 0.3em 0.3em 0.3em;
        margin: 0.6em;
        background: transparent url() no-repeat left bottom;
        border: solid #adb3c9 0px;
    }

    /*backとかtopのとこ*/
    .footer {
        max-width: 600px;
        text-align: left;
        padding: 10px 5%;
        margin-top: 15px;
        margin-bottom: 30px;
        margin-left: auto;
        margin-right: auto;
        background: #fff url() no-repeat left bottom;
        border: solid #fff 1px;
        letter-spacing: 2px;
        border-radius: 10px;
        display: flex;
        justify-content: center;
        font-family: 'Abel', sans-serif;
    }

    /*ボタンの形*/
    .footer a {
        color: #C4B09D;
        padding: 5px 10px;
        border: solid 1px #C4B09D;
        border-radius: 10px;
        margin: 0px 0.15em 0.5em 0px;
        background-color: #fff;
    }



/*章タイトルとトップページで使用*/

h2 {
    font-family: 'Amatic SC', cursive;
    font-size: 130%;
   }

        /*スマホから非表示*/
.spNone { display: none;}

    
    
}
/*おおきい画面*/
@media screen and (min-width:381px) {
    body {
        color: #3c4a5d;
        background: #3c4a5d  url() repeat fixed;
        word-wrap: break-word;
        overflow-wrap: break-word;
        text-align: center;
        line-height: 2.0;
        font-family: font-family:"HiraMinProN-W3", "游ゴシック Medium", "Yu Gothic Medium", 'メイリオ', Verdana, Arial, Osaka, Helvetica, sans-serif;
        font-size: 90%;
    }
    body.news {
        background: transparent url() no-repeat left bottom;
        word-wrap: break-word;
        overflow-wrap: break-word;
        text-align: center;
        line-height: 1.2em;
        font-family: font-family:"HiraMinProN-W3", "游ゴシック Medium", "Yu Gothic Medium", 'メイリオ', Verdana, Arial, Osaka, Helvetica, sans-serif;
        font-size: 90%;
    }
    
    
    br {
        letter-spacing: 0;
    }

    .all {
        max-width: 600px;
        text-align: left;
        padding: 5% 5%;
        margin: 1.5em auto ;
        background: #fafafa url() no-repeat left bottom;
        border: #E9E3D9 solid  1px;
        letter-spacing: 2px;
        border-radius: 10px;
    }


    /*backとかtopのとこ*/
    .footer {
        max-width: 600px;
        text-align: left;
        padding: 10px 5%;
        margin: 15px auto;
        background: #fff url() no-repeat left bottom;
        border: solid #fff 1px;
        letter-spacing: 2px;
        border-radius: 10px;
        display: flex;
        justify-content: center;
        font-family: 'Abel', sans-serif;
    }

    /*下のボタンの色*/
    .footer a {
        color: #C4B09D;
        padding: 5px 15px;
        border: solid 1px #C4B09D;
        border-radius: 15px;
        /*丸み具合*/
        margin: 0px 0.15em 0.5em 0px;
        background-color: #fff;


    }




    h2 {
        margin: 0px;
        font-family: 'Amatic SC', cursive;
        font-size: 160%;
    }


    h2:first-letter {
        font-size: 35px;
        color: #325A8C;
    }

    /*PCから非表示*/
    .pcNone { display: none;}
    
    
}

}