@charset "utf-8";
@import url('https://use.fontawesome.com/releases/v5.0.9/css/all.css');
@import url('https://fonts.googleapis.com/css?family=Italiana');

html {
 background: transparent;
 font-size: 62.5%;
}
body {
 font-size: 1.2rem;
 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;
}
h1,h2,h3,h4 {
 font-family: 'Italiana', serif;
}
h1 {
 padding: 0.5em 0em;
 font-family: 'Italiana', serif;
 font-size: 2rem;
 text-align: center;
}
h2 {
 display: inline-block;
 padding: 0em 1em;
 margin: 0.5em 0em;
 border-bottom: solid 2px #cccccc;
 font-family: 'Italiana', serif;
}
h3 {
 margin: 0.5em 0em 0.5em 1em;
}
em {
 color: #999999;
}
ol,ul,dl {
 list-style: none;
}
input,textarea,select,button {
 border: solid 1px #cccccc;
 font-family: inherit;
 font-size: 100%;
}
textarea {
 padding: 0.2em;
 width: 90%;
}

p {
 padding: 0em 1em;
}
section {
 margin: 1em 0em;
}


main {
 display: block;
 margin: 2rem auto 5rem;
  width: 90%;
  max-width: 500px;
}

.wrap {
 display: flex;
  flex-direction: column;
  flex-wrap: wrap;
 margin: 5rem auto;
  width: 90%;
  max-width: 500px;
}
header,footer {
 margin: 2rem auto;
  width: 50%;
 font-family: 'Italiana', serif;
 text-align: center;
}
.img_top {
 color: #94d1cd;
 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.2rem;
}
.info {
 padding: 2rem 0rem;
 box-sizing: border-box;
}
.box {
 margin-top: 1em;
 width: 100%;
 height: 10rem;
 border: solid 1px #dddddd;
 overflow: auto;
}
.new {
 padding: 0em;
 margin: 0em;
 font-size: 1.1rem;
}
.new p {
 padding-left: 1em;
}
.new span {
 padding-right: 1em;
}



.novel {
 width: 90%;
 max-width: 500px;
 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: 1em;

}
.novel li i {
 padding: 0rem;
 font-size: 8.0rem;
}
.novel li div {
 width: 100%;
}
/*.novel li i::after {
 content: '\f3a5';
}*/
.novel li h3 {
 display: block;
 padding: 0em 0.5em;
 margin: 0em;
 font-family: 'Italiana', serif;
 font-size: 1.2rem;
 text-align: center;
}
.novel h3 span {
 padding: 0em 1em;
 color: #000000;
 font-size: 1rem;
 font-weight: normal;
}
.novel p {
 padding: 0.5em 1em;
 color: #444444;
 text-align: left;
}

.img_1 {
 background: url('../img/design32_4.jpg') center / 140%;
}
.img_2 {
 background: url('../img/design32_7.jpg') center / 120%;
}
.img_3 {
 background: url('../img/design32_6.jpg') center / 190%;
}
.img_4 {
 background: url('../img/design32_5.jpg') center / 240%;
}
.img_5 {
 background: url('../img/design32_9.jpg');
}
.image {
 background-clip: text;
 -webkit-background-clip: text;
 background-color: #555555;
 color: transparent;

}

.right {
 text-align: right;
}


