@charset "UTF-8";
/*
html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

nav ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

/* change colours to suit your needs */
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}

/* change colours to suit your needs */
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}

del {
  text-decoration: line-through;
}

abbr[title], dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* change border colour to suit your needs */
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}

input, select {
  vertical-align: middle;
}

li {
  list-style-type: none;
}

@font-face {
  font-family: 'fontello';
  src: url("../font/fontello.eot?82512596");
  src: url("../font/fontello.eot?82512596#iefix") format("embedded-opentype"), url("../font/fontello.woff?82512596") format("woff"), url("../font/fontello.ttf?82512596") format("truetype"), url("../font/fontello.svg?82512596#fontello") format("svg");
  font-weight: normal;
  font-style: normal;
}

/* Chrome hack: SVG is rendered more smooth in Windozze. 100% magic, uncomment if you need it. */
/* Note, that will break hinting! In other OS-es font will be not as sharp as it could be */
/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
  @font-face {
    font-family: 'fontello';
    src: url('../font/fontello.svg?82512596#fontello') format('svg');
  }
}
*/
[class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontello";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  /* opacity: .8; */
  /* For safety - reset parent styles, that can break glyph codes*/
  font-variant: normal;
  text-transform: none;
  /* fix buttons height, for twitter bootstrap */
  line-height: 1em;
  /* Animation center compensation - margins should be symmetric */
  /* remove if not needed */
  margin-left: .2em;
  /* you can be more comfortable with increased icons size */
  /* font-size: 120%; */
  /* Uncomment for 3D effect */
  /* text-shadow: 1px 1px 1px rgba(127, 127, 127, 0.3); */
}

.icon-right:before {
  content: '\e800';
}

/* '' */
/* common
	========================================================================== */
body {
  color: #000;
  line-height: 1.5;
  font-family: 'ヒラギノ角ゴ ProN W3', 'HiraKakuProN-W3', 'メイリオ', Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
  font-size: 14px;
  background: url("../img/bg.jpg") 50% 50%;
  background-size: 539px 384px;
}

*, *::before, *::after {
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

a {
  -webkit-touch-callout: none;
  text-decoration: none;
}

img:not([width]) {
  zoom: .5;
}

.imgr {
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

.clearfix:after {
  content: "";
  height: 0;
  clear: both;
  display: block;
}

.row {
  width: 290px;
  margin: 0 auto;
}

/*.music i{ @include sprite-background(icon_sound, $s-pc);}
.lylic i{ @include sprite-background(icon_lylic, $s-pc); }
.inst i{ @include sprite-background(icon_inst, $s-pc);}
.mv i{ @include sprite-background(icon_mv, $s-pc); }
@media(max-width:768px){
    .music i{ @include sprite-background-retina(icon_sound, $s-sp); }
    .lylic i{ @include sprite-background-retina(icon_lylic, $s-sp); }
    .inst i{ @include sprite-background-retina(icon_inst, $s-sp);}
}*/
/* main
	========================================================================== */
/* [ role=main ] */
main > h1 {
  margin-bottom: 15px;
}
main > h1 img {
  width: 100%;
  vertical-align: middle;
}

section {
  margin-bottom: 15px;
}

/* [ note ] */
.note {
  width: 290px;
  overflow: hidden;
  background: url("../img/bg_note.png") no-repeat;
  background-size: 290px auto;
  border-radius: 5px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
  padding-top: 15px;
  margin-bottom: 10px;
  border-bottom: 10px solid #fff;
  overflow: hidden;
}
.note h1 {
  margin-bottom: 10px;
}
.note figcaption {
  padding: 0 13px;
  line-height: 21px;
  margin-bottom: 5px;
  letter-spacing: -.08em;
}

#tsukin h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -200px;
  background-size: 290px auto;
}

#sma h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -110px;
  background-size: 290px auto;
}

#bousai h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -80px;
  background-size: 290px auto;
}

#sakura h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -320px;
  background-size: 290px auto;
}

#kafun h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -260px;
  background-size: 290px auto;
}

#solive h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -140px;
  background-size: 290px auto;
}

#report h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -170px;
  background-size: 290px auto;
}

#sorauta h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -290px;
  background-size: 290px auto;
}

#gensai h1 {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 30px;
  width: 290px;
  background-position: 0 -230px;
  background-size: 290px auto;
}

/* [ apps ] */
.apps li {
  margin-top: 5px;
}
.apps .btn a {
  display: block;
  border: 1px solid #fff;
  border-radius: 4px;
  line-height: 40px;
  color: #fff;
  position: relative;
  padding-left: 10px;
  font-size: 16px;
  font-weight: bold;
}
.apps .btn a i {
  position: absolute;
  right: 3px;
  font-size: 13px;
  font-weight: normal;
}
.apps .as, .apps .gp {
  display: none;
}
.apps .as a {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 40px;
  width: 290px;
  background-position: 0 -40px;
  background-size: 290px auto;
}
.apps .gp a {
  background-image: url('../img/sprite-s29a5d1ade5.png');
  background-repeat: no-repeat;
  display: block;
  height: 40px;
  width: 290px;
  background-position: 0 0;
  background-size: 290px auto;
}

#tsukin .btn a {
  background: #c5d868;
  color: #465b38;
}

#bousai .btn a,
#sma .btn a {
  background: #865b90;
}

#sakura .btn a {
  background: #fed0d8;
  color: #e4536b;
}

#kafun .btn a {
  background: #ffffb9;
  color: #64b394;
}

#solive .btn a {
  background: #2c66af;
}

#report .btn a {
  background: #fff;
  color: #4db7f9;
}

#sorauta .btn a {
  background: #5ece8d;
}

#gensai .btn a {
  background: #3aa439;
}

/* footer
	========================================================================== */
footer {
  font-size: 10px;
  padding: 0 0 10px;
  text-align: center;
}