@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/sawarabimincho.css');

html {
 background: transparent;
 font-size: 62.5%;
}
body {
 background: url('../bg.jpg') center top / 230% no-repeat fixed #000;
 color: #ffffff;
 font-size: 1.1rem;
 font-family: 'Sawarabi Mincho', serif;
 letter-spacing: 0.2em;
 line-height: 180%;
}
a {
 text-decoration: none;
}
h1 {
 color: #ffffff;
}
h2 {
 display: inline-block;
 padding: 0.1em 0.2em;
 margin: 0.3em 0em;
 color: #fff;
 font-size: 1.3rem;
 border-bottom: solid 1px #fff;
}
h3 {
 margin: 0.5em;
}
em {
 border-bottom: solid 1px #12ba23;
 font-style: normal;
}
ol,ul,dl {
 list-style: none;
}
input,textarea,button,select {
 background: rgba(0,0,0,0.6);
 border: solid 1px #ffffff;
 color: #ffffff;
 font-family: inherit;
 font-size: 100%;

}
textarea {
 padding: 0.2em;
 width: 90%;
}

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

main {
 display: block;
 padding: 1rem;
 margin: 0em auto;
 width: 90%;
 max-width: 500px;
 background: rgba(0,0,0,0.7);
}
main a {
 color: #12ba23;
 border-bottom: solid 1px #fff;
}

header h1 {
 font-family: serif;
 color:#f2f2f2;
 text-shadow: 0 0 15px #0c3d5b,0 0 20px #0c3d5b;
 padding: 2em 0em 1em 0em;
 font-size: 3em;
 text-align: center;
}
nav {
 display: flex;
  justify-content: center;
  align-items: center;
 padding: 1em 0em;
 height: 30vh;
 font-size: 1.2rem;
 order: -1;
}
nav ul {
 display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
nav li {
 margin: 0.2em 0.5em;
}
nav li a {
 padding: 0.3em;
 background: rgba(0,0,0,0.5);
 color: #ffffff;
}

.text {
 padding: 2rem 1rem;
 box-sizing: border-box;
 line-height: 200%;
}
.text p {
 text-indent: 1em;
}