@charset "utf-8";
@import url('https://use.fontawesome.com/releases/v6.1.1/css/all.css');
@import url('https://fonts.googleapis.com/css?family=Italiana');
@import url('https://fonts.googleapis.com/css2?family=Klee+One&display=swap');

html {
 background: transparent;
 font-size: 62.5%;
}
body {
 font-size: 1.3rem;
 font-family: 'メイリオ', 'ヒラギノ角ゴ', sans-serif;
 letter-spacing: 0.2em;
 line-height: 180%;
}
a {
 background: #ededed;
 color: #000000;
 text-decoration: none;
 transition: 0.7s;
}
a:hover {
 background: #d7eceb;
}
a.link{
 background: #fff;
 border-bottom: double 3px #ededed;
 transition: 0.7s;
}
a.link:hover {
 background: #fff;
 border-bottom: double 3px #d7eceb;
}
h1 {
 padding: 0.5em 0em;
 font-family: 'Italiana','Klee One', serif;
 font-size: 4rem;
 text-align: center;
}
h1:first-letter{
 color: #94d1cd;
 }
.hitokoto{
 line-height:1.5;
}
h2 {
 display: inline-block;
 padding: 0em 1em;
 margin: 0.5em 0em;
 border-bottom: solid 2px #cccccc;
 font-family: 'Italiana','Klee One', serif;
 font-size: 1.3em;
}
h3 {
 margin: 0.5em 0em 0.5em 1em;
 color: #555555;
 font-family: 'Italiana','Klee One', serif;
}
em {
 color: #888888;
}
ol,ul,dl {
 list-style: none;
}
input,textarea,select,button {
 border: solid 1px #cccccc;
 font-family: inherit;
 font-size: 100%;
}

p {
 padding: 0em 1em;
}
section {
 margin: 2em 0em;
}


main {
 display: block;
 margin: 5rem auto;
 width: 50%;
 min-width: 600px;
}

.wrap {
 display: flex;
 flex-wrap: wrap;
 margin: 5rem auto;
 width: 90%;
 min-width: 800px;
}
header,footer {
 width: 100%;
 font-family: 'メイリオ','Italiana', serif;
 text-align: center;
}
.img_top {
 background: linear-gradient(#94d1cd, #d7e0e0);
 color: transparent;
 font-size: 3rem;
}
header ul {
 display: flex;
 justify-content: center;
}
header li {
 margin: 0em 1em;
}
nav {
 padding: 1em 0em;
}
nav li a {
 padding: 0.5em;
 font-size: 1.5rem;
}
.info {
 padding: 2rem 10%;
 box-sizing: border-box;
 width: 80%;
}
.box {
 padding-top: 2rem;
 width: 20%;
 overflow: auto;
}
.new {

}
.new p {
 padding: 0.3em 0em 0.3em 1em;
}
.new span {
 padding-right: 1em;
}
.em {
 color: #94d1cd;
}


.novel {
 text-align: center;
}
.novel a {
 padding: 0em 0.5em;
}
.novel a:hover {
 background: #cfcfcf;
}

.novel ul {
 padding: 2em 0em;
}
.novel li {
 display: flex;
 align-items: center;
 padding: 2em 0em;
 box-sizing: border-box;
}
.novel li div {
 padding: 1em;
 width: 100%;
}
.novel li i {
 display: inline-block;
 padding: 0rem;
 font-size: 20.0rem;
}
.novel li h3 {
 padding: 0.5em 0em;
 font-family: 'Italiana', serif;
 font-size: 2.0rem;
}
.novel h3 span {
 padding: 0em 1em;
 color: #000000;
 font-size: 0.6em;
 font-weight: normal;
}
.novel p {
 color: #444444;
 text-align: left;
}


.img_1 {
 background: url('../img/design32_4.jpg') center / 140% #e296de;
}
.img_2 {
 background: url('../img/design32_7.jpg') center / 120% #6bc9d1;
}
.img_3 {
 background: url('../img/design32_6.jpg') center / 190% #d1c16b;
}
.img_4 {
 background: url('../img/design32_5.jpg') center / 240% #6059a8;
}
.img_5 {
 background: url('../img/design32_9.jpg');
}
.image {
 background-clip: text;
 -webkit-background-clip: text;
 color: transparent;
}

.right {
 text-align: right;
}


.list-image a, .list-image span {
 display: inline-block;
 width: 100px;
 color: #6c5b7c;
 background: #fff;
 vertical-align: top;
 text-align: center;
}

.list-image > * {
 margin: 0 7px 11px 0;
 padding: 5px 5px 0 5px;
}

.list-image > *:nth-child(6n) {
 margin-right: 0;
}

input[type],
textarea {
 box-sizing: border-box;
 font-family: 'Klee One','inherit';
 font-size: 95%;
}
.form {
 padding: .3rem;
 border: #8f8f8f solid 1px;
 color: inherit;
}
.button {
 padding: .3rem 1rem;
 margin-right: 1em;
 background: #586264;
 border: none;
 color: #fff;
}

.mailForm {
 width: 100%;
}

.titleForm {
 width: 50%;
}
.mailForm .form {
 display: block;
 width: 40%;
 height:200px;
 margin-bottom: 1rem;
}
.mailForm .form2 {
 display: block;
 width: 60%;
 height:100px;
 margin-bottom: 1rem;
}
textarea.form {
 height: 80px;
}

div.thread div.time { display:none; }
div.thread div.time:last-child { display:block; }