@charset "UTF-8";
#messages li.kaityoumiyoko, #messages li.kusemono.kusemono-te.odaikan, #messages li.ben, #messages li.raga-man, #messages li.kuuyasyounin, #messages li.tako.tako-te, #messages li.taremaku, #messages li.risuoka, #messages li.ainoyukue, #messages li.momo, #messages li.oni, #messages li.kunren-tori {
  background-color: #FFF;
  padding: 20px;
  border: 8px solid #86e673;
  border-radius: 38px;
}

.ufo {
  left: 0%;
  top: 0%;
  width: 7.82258%;
  height: 5.66502%;
}

#illusts li.kaityoumiyoko {
  left: 67.25806%;
  top: 6.15764%;
  width: 30.08065%;
  height: 26.97044%;
}

#illusts li.kusemono, #illusts li.kusemono-te {
  left: 45.32258%;
  top: 30.17241%;
  width: 16.37097%;
  height: 51.10837%;
}

#illusts li.ben {
  left: 52.74194%;
  top: 67.85714%;
  width: 17.33871%;
  height: 24.87685%;
}

#illusts li.raga-man {
  left: 83.3871%;
  top: 28.69458%;
  width: 14.1129%;
  height: 37.43842%;
}

#illusts li.kuuyasyounin.body {
  left: 10.48387%;
  top: 7.88177%;
  width: 17.41935%;
  height: 37.19212%;
}

#illusts li.kuuyasyounin.bosatu {
  left: 0%;
  top: 15.76355%;
  width: 16.93548%;
  height: 9.85222%;
}

#illusts li.tako, #illusts li.tako-te {
  left: 57.82258%;
  top: 21.55172%;
  width: 15.8871%;
  height: 29.18719%;
}

#illusts li.taremaku {
  left: 41.53226%;
  top: 6.40394%;
  width: 15.16129%;
  height: 59.1133%;
}

#illusts li.kusudama {
  left: 40.8871%;
  top: 0%;
  width: 20.08065%;
  height: 29.80296%;
}

#illusts li.risuoka {
  left: 65.64516%;
  top: 22.41379%;
  width: 22.90323%;
  height: 73.89163%;
}

#illusts li.ainoyukue {
  left: 11.77419%;
  top: 30.54187%;
  width: 20.72581%;
  height: 61.4532%;
}

#illusts li.momo {
  left: 26.45161%;
  top: 56.89655%;
  width: 14.83871%;
  height: 39.53202%;
}

#illusts li.oni {
  left: 83.22581%;
  top: 53.20197%;
  width: 16.77419%;
  height: 44.33498%;
}

#illusts li.kunren-tori {
  left: 22.17742%;
  top: 2.46305%;
  width: 29.43548%;
  height: 33.99015%;
}

#illusts li.odaikan {
  left: 35.32258%;
  top: 27.3399%;
  width: 18.46774%;
  height: 72.6601%;
}

#illusts, #links, #messages {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

#links li.kaityoumiyoko {
  left: 67.25806%;
  top: 6.15764%;
  width: 30.08065%;
  height: 26.97044%;
}

#links li.kusemono {
  left: 45.32258%;
  top: 30.17241%;
  width: 16.37097%;
  height: 51.10837%;
}

#links li.ben {
  left: 52.74194%;
  top: 67.85714%;
  width: 17.33871%;
  height: 24.87685%;
}

#links li.raga-man {
  left: 83.3871%;
  top: 28.69458%;
  width: 14.1129%;
  height: 37.43842%;
}

#links li.kuuyasyounin.body {
  left: 10.48387%;
  top: 7.88177%;
  width: 17.41935%;
  height: 28.07882%;
}

#links li.kuuyasyounin.bosatu {
  left: 0%;
  top: 15.76355%;
  width: 16.93548%;
  height: 9.85222%;
}

#links li.tako {
  left: 60.80645%;
  top: 21.55172%;
  width: 12.90323%;
  height: 29.18719%;
}

#links li.taremaku {
  left: 45.56452%;
  top: 1.35468%;
  width: 10.64516%;
  height: 45.07389%;
}

#links li.risuoka {
  left: 68.62903%;
  top: 22.41379%;
  width: 18.30645%;
  height: 73.89163%;
}

#links li.ainoyukue {
  left: 12.74194%;
  top: 30.54187%;
  width: 19.75806%;
  height: 61.4532%;
}

#links li.momo {
  left: 26.45161%;
  top: 59.35961%;
  width: 14.83871%;
  height: 28.57143%;
}

#links li.oni {
  left: 83.22581%;
  top: 53.20197%;
  width: 16.77419%;
  height: 44.33498%;
}

#links li.kunren-tori {
  left: 22.17742%;
  top: 4.4335%;
  width: 24.43548%;
  height: 27.95567%;
}

#links li.odaikan {
  left: 38.30645%;
  top: 29.31034%;
  width: 13.3871%;
  height: 70.5665%;
}

.only-sp {
  display: none;
}

#chars {
  position: relative;
  width: 96.875%;
  max-width: 1240px;
  height: 812px;
  margin: 0 auto;
}

.ufo {
  z-index: -1;
  display: none;
  position: absolute;
  max-width: 97px;
  max-height: 46px;
}
.ufo img {
  width: 100%;
}

#illusts li {
  display: none;
  position: absolute;
}
#illusts li img {
  width: 100%;
}
#illusts li.kuuyasyounin.bosatu {
  position: relative;
  overflow: hidden;
}
#illusts li.kuuyasyounin.bosatu img {
  position: relative;
  left: 78%;
  top: -24%;
}

#links li {
  position: absolute;
}
#links li a {
  display: block;
  width: 100%;
  height: 100%;
}

#messages {
  display: none;
}
#messages li {
  position: absolute;
}
#messages li p {
  margin: 0;
  font-size: 180%;
  font-weight: normal;
  font-family: "秀英丸ゴシック B", "YuGothic", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  color: #86e673;
}
#messages li.kaityoumiyoko {
  left: 79.19355%;
  top: 2.21675%;
  display: inline-block;
}
#messages li.kaityoumiyoko:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-top-color: #86e673;
  border-top-width: 30px;
  border-right-width: 5px;
  border-bottom-width: 0px;
  border-left-width: 15px;
  bottom: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.kusemono.kusemono-te.odaikan {
  left: 39.35484%;
  top: 56.40394%;
  display: inline-block;
}
#messages li.kusemono.kusemono-te.odaikan:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #86e673;
  border-top-width: 0px;
  border-right-width: 15px;
  border-bottom-width: 30px;
  border-left-width: 5px;
  top: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.ben {
  left: 60.40323%;
  top: 64.65517%;
  display: inline-block;
}
#messages li.ben:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-top-color: #86e673;
  border-top-width: 30px;
  border-right-width: 5px;
  border-bottom-width: 0px;
  border-left-width: 15px;
  bottom: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.raga-man {
  left: 91.45161%;
  top: 41.62562%;
  display: inline-block;
}
#messages li.raga-man:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-right-color: #86e673;
  border-top-width: 5px;
  border-right-width: 30px;
  border-bottom-width: 15px;
  border-left-width: 0px;
  left: -30px;
  top: 50%;
  margin-top: -10px;
}
#messages li.kuuyasyounin {
  left: 0.96774%;
  top: 26.10837%;
  display: inline-block;
}
#messages li.kuuyasyounin:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #86e673;
  border-top-width: 0px;
  border-right-width: 15px;
  border-bottom-width: 30px;
  border-left-width: 5px;
  top: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.tako.tako-te {
  left: 58.79032%;
  top: 50.49261%;
  display: inline-block;
}
#messages li.tako.tako-te:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #86e673;
  border-top-width: 0px;
  border-right-width: 15px;
  border-bottom-width: 30px;
  border-left-width: 5px;
  top: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.taremaku {
  left: 41.53226%;
  top: 6.40394%;
  display: inline-block;
}
#messages li.taremaku:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-top-color: #86e673;
  border-top-width: 30px;
  border-right-width: 5px;
  border-bottom-width: 0px;
  border-left-width: 15px;
  bottom: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.risuoka {
  left: 71.6129%;
  top: 43.34975%;
  display: inline-block;
}
#messages li.risuoka:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #86e673;
  border-top-width: 0px;
  border-right-width: 15px;
  border-bottom-width: 30px;
  border-left-width: 5px;
  top: -30px;
  left: 50%;
  margin-left: -10px;
}
#messages li.ainoyukue {
  left: 3.79032%;
  top: 46.55172%;
  display: inline-block;
}
#messages li.ainoyukue:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-left-color: #86e673;
  border-top-width: 15px;
  border-right-width: 0px;
  border-bottom-width: 5px;
  border-left-width: 30px;
  right: -30px;
  top: 50%;
  margin-top: -10px;
}
#messages li.momo {
  left: 22.41935%;
  top: 66.87192%;
  display: inline-block;
}
#messages li.momo:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-left-color: #86e673;
  border-top-width: 15px;
  border-right-width: 0px;
  border-bottom-width: 5px;
  border-left-width: 30px;
  right: -30px;
  top: 50%;
  margin-top: -10px;
}
#messages li.oni {
  left: 74.19355%;
  top: 73.15271%;
  display: inline-block;
}
#messages li.oni:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-left-color: #86e673;
  border-top-width: 15px;
  border-right-width: 0px;
  border-bottom-width: 5px;
  border-left-width: 30px;
  right: -30px;
  top: 50%;
  margin-top: -10px;
}
#messages li.kunren-tori {
  left: 18.14516%;
  top: 22.78325%;
  display: inline-block;
}
#messages li.kunren-tori:before {
  content: "";
  position: absolute;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #86e673;
  border-top-width: 0px;
  border-right-width: 15px;
  border-bottom-width: 30px;
  border-left-width: 5px;
  top: -30px;
  left: 50%;
  margin-left: -10px;
}

#navi {
  margin: 40px auto;
  text-align: center;
  letter-spacing: -0.4em;
}
#navi .show-all {
  display: inline-block;
  margin: 0 20px;
  vertical-align: middle;
}
#navi .show-all a {
  display: block;
  padding: 30px 60px;
  border-radius: 8px;
  font-size: 220%;
  font-weight: normal;
  font-family: "秀英丸ゴシック B", "YuGothic", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  line-height: 1em;
  letter-spacing: 0.075em;
  background-color: #86e673;
  color: #FFFFFF;
  -moz-box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
}
#navi .show-all a:hover {
  margin: 2px -1px -2px 1px;
  -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
}
#navi .usual {
  display: inline-block;
  margin: 0 20px;
  vertical-align: middle;
}
#navi .usual a {
  display: block;
  padding: 15px 30px;
  background-color: #FFFFFF;
  border: 4px solid #86e673;
  border-radius: 8px;
  font-weight: normal;
  font-family: "秀英丸ゴシック B", "YuGothic", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 180%;
  line-height: 1em;
  letter-spacing: 0.075em;
  color: #86e673;
  -moz-box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 1px 2px 0px 0px rgba(0, 0, 0, 0.3);
}
#navi .usual a:hover {
  margin: 2px -1px -2px 1px;
  -moz-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
  -webkit-box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
  box-shadow: 0px 0px 0px 0px rgba(0, 0, 0, 0.3);
}

#others {
  max-width: 1120px;
  width: 93.4%;
  margin: 0 auto;
}
#others h3 {
  font-size: 240%;
  font-weight: normal;
  text-align: center;
  color: #86e673;
}
#others ul {
  letter-spacing: -0.4em;
  text-align: center;
}
#others ul li {
  display: inline-block;
  position: relative;
  margin: 19px 19px;
  width: 102px;
  letter-spacing: 0.075em;
  text-align: left;
  vertical-align: top;
}
#others ul li a {
  display: block;
  font-size: 120%;
  line-height: 1.25em;
  letter-spacing: 0.075em;
  font-weight: normal;
  font-family: "秀英丸ゴシック B", "YuGothic", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#others ul li a > img {
  border: 1px solid #CCC;
}
#others ul li a > img + span {
  height: 2.5em;
}
#others ul li a > img + span:after {
  content: "";
  display: inline-block;
  width: 1px;
  margin-left: -1px;
  vertical-align: middle;
  height: 2.5em;
}
#others ul li a > img + span > span {
  display: inline-block;
}
#others ul li a span {
  display: block;
}
#others ul li a span.icon {
  position: absolute;
  top: -19px;
  left: -19px;
  background-color: #FFF;
  border: 1px solid #CCC;
  border-radius: 4px;
  overflow: hidden;
}

@media screen and (max-width: 600px) {
  .only-sp.inline {
    display: inline;
  }
  .only-sp.inline-block {
    display: inline-block;
  }
  .only-sp.block {
    display: block;
  }

  #messages li {
    width: 100%;
    text-align: center;
  }
  #messages li p {
    font-size: 160%;
    line-height: 1em;
  }
  #messages li:before {
    content: none !important;
  }
  #messages li.kaityoumiyoko, #messages li.kusemono.kusemono-te.odaikan, #messages li.ben, #messages li.raga-man, #messages li.kuuyasyounin, #messages li.tako.tako-te, #messages li.taremaku, #messages li.risuoka, #messages li.ainoyukue, #messages li.momo, #messages li.oni, #messages li.kunren-tori {
    top: 102%;
    left: 0;
    display: block;
    padding: 15px;
    border-width: 4px;
    border-radius: 8px;
  }

  #menu {
    margin-top: 90px;
  }
  #menu ul {
    border-top: 1px solid #cccccc;
  }
  #menu ul li {
    display: block;
    width: 100%;
    letter-spacing: 0.075em;
    text-align: left;
    vertical-align: top;
  }
  #menu ul li a {
    display: block;
    padding: 5px;
    border-bottom: 1px solid #cccccc;
    background-color: #FFF;
    font-size: 160%;
    font-weight: normal;
    font-family: "秀英丸ゴシック B", "YuGothic", "Yu Gothic", "游ゴシック", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    overflow: hidden;
  }
  #menu ul li a img {
    float: left;
    width: 50px;
    border: 1px solid #cccccc;
    vertical-align: middle;
    margin-right: 10px;
  }
  #menu ul li a > span {
    display: block;
    margin-left: 60px;
  }
  #menu ul li a > span:after {
    content: "";
    display: inline-block;
    width: 1px;
    height: 50px;
    margin-right: -1px;
    vertical-align: middle;
  }
  #menu ul li a > span span {
    vertical-align: middle;
    display: inline-block;
  }

  #others h3 {
    line-height: 1.2em;
  }

  #navi {
    margin: 20px auto;
  }
  #navi .show-all {
    margin: 0 10px 20px;
  }
  #navi .show-all a {
    padding: 20px 30px;
    font-size: 200%;
  }
  #navi .usual {
    margin: 0 10px 20px;
  }
  #navi .usual a {
    padding: 10px 20px;
    font-size: 150%;
  }
}
