@font-face {
  font-family: sozai405;
  src: url(img/f/mikiyu-newpenji-p.ttf);
}
@font-face {
  font-family: littledevil;
  src: url(img/f/LittleDevil.ttf);
}

* { padding: 0; margin: 0;}
html {
  background-color: #ffbbcc;
  font-size: 18px;
  font-family:'Times New Roman', Times, serif;
  background-image: url(img/sozaiback.png);
  overflow: auto;
}
body {
  position: relative;
  overflow: hidden;
  width: 900px;
  margin: 15px auto;
  border-width:7px;
  border-style: solid;
  border-image: url("/img/lace2.png") 8 fill round;
  background-color: #000000;
  color: #dddddd;
}
header {
  height: 300px;
  background-image: url(img/sozaibanner.png);
}
main {
  padding: 10px;
  background-color: #000000;
}
footer {
  height: 100px;
  background-color: #000000;
  background-image: linear-gradient(#000000 0%, #00000000 100%), url(/img/backdomain.png);
  margin-top: -30px;
  overflow: hidden;
}
.nono {
  width: 450px;
  height: 195px;
  position: absolute;
  right: 0;
  bottom: 0;
  display: flex;
}
.nono p {
  color: #eebb7700;
  line-height: 230px;
  margin-bottom: 0;
  font-family: sans-serif;
  font-size: 13px;
  font-weight: bold;
  text-align: right;
  text-indent: 0;
}
.nono:hover p {
  color: #eebb77ff;
  transition: 1s;
}
.icon {
  margin: 10px;
  border-width:8px;
  border-style: solid;
  border-image: url("/img/lace4.png") 8 round;
  float: left;
}
h1 {
  font-size: 60px;
  text-align: right;
  color: #ffffff;
  text-shadow: 6px 3px 1px #aa3366;
  padding: 10px;
  margin: auto;
  margin-top: -200px;
  span:nth-of-type(odd) {
    color: #eebb77;
  }
}
h2 {
    padding: 5px;
    text-align: center;
}
p {
  text-indent: 1em;
  margin: 15px;
}
b {
  color: #aa3366;
  font-family: sans-serif;
}
i {
  color: #eebb77;
}
u {
  color: #6677cc;
  font-family: monospace;
  font-weight: bold;
}
small {
  color: #77aa99;
  font-family: sans-serif;
}
a {
  background-color: #aa336699;
  color: #ffffff;
  padding: 3px;
  transition: 0.5s;
}
a:hover {
  background-color: #aa3366;
}
flex {
  width: 100%;
    display: flex;
    flex-wrap: wrap;
}
section {
    margin: 10px;
    padding: 5px;
    width: 810px;
    height: 250px;
    overflow: auto;
    margin: auto;
    margin-top: 30px;
    border-width:7px;
    border-style: solid;
    border-image: url("/img/lace2.png") 8 round;
    img {
      max-width: 100%;
    }
}

.sozai405 {
    font-family: sozai405;
    line-height: 1.3;
    background-color: #c9e9ff;
    padding-left: 100px;
    width: 710px;
    background-image: url(img/405back.gif);
    background-repeat: repeat-y;
    color: #442222;
    b, u, i, small {
        color: #442222;
    }
}
.apupu {
    width: 370px;
    background-color: #ff9933;
    color: #000000;
    header {
        margin: -5px;
        height: 110px;
        background-image: url(img/apuputop.gif), url(img/apupubugs.gif);
        background-position: bottom;
        background-repeat: repeat-x, repeat;
        background-color: #000000;
        padding-top: 10px;
    }
}
.fancyparts {
    width: 370px;
    background-color: #ffffff;
    color: #993355;
    background-image: url(img/fancypartsback.gif);
}
.lapin {
    width: 370px;
    background-color: #ffffff;
    color: #000000;
    background-image: url(img/lapinagileback.gif);
}
.alicehome {
    width: 370px;
    background-color: #ffffff;
    color: #dd77bb;
    header {
      background-image: url(img/aliceback.gif);
      height: 70px;
    }
}
.foollovers {
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/foolloversback.gif);
  .box02{
    background:url(img/foolloversback2.gif);
    border:solid 1px #483b3c;
    margin:1em auto; /* 中央寄せは0をautoに変更 */
    padding:20px 0;
    width:80%  /* 幅 */
    }
    .box-inner{
    background:#fff;
    border-bottom:2px dashed #c3c2ad;
    border-top:2px dashed #c3c2ad;
    box-shadow:0 4px 0 #fff,0 -4px 0 #fff;
    padding:15px
    }
}
.kb {
  width: 370px;
  background-image: url(img/1kbback.gif);
  color: #117733;
}
.chiple {
  width: 370px;
  background-color: #ffffff;
  color: #ff4499;
  header {
    height: 80px;
    background-image: url(img/chipleback.gif);
  }
}
.sorahana {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/sorahanaback.gif);
}
.asterism {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/asterismback.gif);
  h2 {
    font-family: littledevil;
  }
}
.mococo {
  width: 370px;
  background-color: #f8f6e9;
  color: #000000;
}
.ooparts {
  width: 370px;
  background-color: #f8f6e9;
  color: #225533;
  background-image: url(img/oopartsback.gif);
}
.lsd69 {
  width: 370px;
  background-color: #cccccc;
  color: #333333;
  background-image: url(img/lsd69back2.gif);
  header {
    height: 40px;
    background-image: url(img/lsd69back.gif);
  }
}
.neohimeism {
  width: 270px;
  padding-left: 100px;
  background-color: #ffffff;
  color: #dd77bb;
  background-image: url(img/neohimeismback.gif);
  background-repeat: repeat-y;
}
.soratobu {
  width: 370px;
}
.voiceless {
  width: 370px;
  background-color: #ffffff99;
  color: #000000;
  background-image: url(img/voicelessback.jpg);
  background-position: bottom right;
  background-size: contain;
  background-blend-mode:screen;
}
.helium {
  width: 370px;
  background-color: #ffffff;
  color: #990000;
  background-image: url(img/heliumback.jpg);
}
.tsuki {
  width: 370px;
  background-color: #ffffff;
  color: #000044;
  background-image: url(img/tsukiback.jpg);
}
.acrossplus {
  width: 370px;
  background-image: url(img/acrossback.gif);
}
.iz {
  width: 370px;
  background-image: url(img/izback.png);
}
.aaa {
  width: 370px;
}
.xxx {
  width: 370px;
}
.oo7 {
  width: 370px;
  background-color: #ffffff99;
  color: #000000;
  background-image: url(img/007back.jpg);
  background-position: bottom left;
  background-size: contain;
  background-blend-mode:screen;
}
.whisperer {
  width: 320px;
  background-color: #ffffff;
  color: #004444;
  background-image: url(img/whispererback.gif), url(img/whispererback2.gif);
  background-repeat: repeat-y, repeat;
  padding-left: 50px;
}
.biyo {
  width: 270px;
  background-color: #225588;
  background-image: url(img/biyoback.gif);
  padding-left: 100px;
}
.kirakira {
  width: 370px;
  background-image: url(img/kirakiraback.gif);
}
.kana {
  width: 370px;
  background-color: #ffffff;
  color: #444444;
  background-image: url(img/kanaback.png);
  background-size: cover;
  background-position: center;
}
.flowerclover {
  width: 370px;
  background-color: #ffffff;
  color: #000044;
  background-image: url(img/flowercloverback.gif);
}
.pixelgaro {
  width: 370px;
}
.firstmoon {
  width: 370px;
  background-color: #ffffff;
  color: #114422;
  background-image: url(img/firstmoonback.jpg);
}
.whim {
  width: 370px;
  background-color: #ffffff;
  color: #dd77bb;
  background-image: url(img/whimback.gif);
  background-position: bottom right;
  background-size: contain;
  background-repeat: no-repeat;
}
.yukari {
  width: 220px;
  background-color: #000000;
  color: #ffbbcc;
  background-image: url(img/yukariback.jpg);
  background-repeat: repeat-y;
  padding-left: 150px;
}
.pomo {
  width: 370px;
  background-color: #ffffff;
  color: #220000;
  background-image: url(img/pomoback.gif);
}
.oyabaka {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/oyabakaback.gif);
}
.civillink {
  width: 270px;
  background-color: #ffffff;
  color: #444444;
  background-image: url(img/civillinkback.gif);
  background-repeat: repeat-y;
  padding-left: 100px;
}
.mizutama {
  width: 370px;
}
.littleeden {
  width: 270px;
  background-image: url(img/littleedenback.jpg);
  background-repeat: repeat-y;
  padding-left: 100px;
}
.pocketsozai {
  width: 370px;
  background-color: #ffffff;
  color: #664400;
  background-image: url(img/pocketsozaiback.png);
}
.neckdoll {
  width: 610px;
  padding-left: 200px;
  background-image: url(img/neckdollback.gif);
}
.chocolatesozai {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/chocolatesozaiback.gif);
}
.rsakmr {
  width: 370px;
}
.andante {
  width: 270px;
  background-image: url(img/andanteback.jpg);
  background-repeat: repeat-y;
  padding-left: 100px;
}
.heartcafe {
  width: 370px;
  background-color: #ffffff;
  color: #550000;
  background-image: url(img/heartcafeback.gif);
}
.travelmin {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/travelminback.gif);
}
.miracletown {
  width: 370px;
  background-color: #ffffff;
  color: #000000;
  background-image: url(img/miracletownback.png);
}
.littlegarden {
  width: 370px;
  background-color: #ffffff;
  color: #223377;
  background-image: url(img/littlegardenback.gif);
}
.niche {
  width: 370px;
  background-color: #ffffff;
  color: #444444;
  background-image: url(img/nicheback.gif);
}
.tora {
  background-color: #ffffff;
  color: #994411;
  background-image: url(img/toraback.gif);
}
.hotchoco {
  width: 370px;
  background-color: #ffffff;
  color: #663300;
  background-image: url(img/hotchocoback.gif);
}
.party {
  width: 370px;
  background-color: #ffffff;
  color: #663300;
  background-image: url(img/partyback.gif);
}