/* ==============================
   Base
============================== */

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

html {
  font-size: 13px;
  line-height: 1.3;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  padding-inline: 100px;

  font-family:
    "ƒqƒ‰ƒMƒmŠpƒS Pro W3",
    "Hiragino Kaku Gothic ProN",
    "Hiragino Kaku Gothic Pro",
    "Yu Gothic",
    Meiryo,
    sans-serif;

  text-align: center;
  color: #333333;
  background-color: #ffffff;
}

h1,
p,
ul {
  margin: 0;
}

h1 {
  font-size: 1rem;
  font-weight: normal;
}

ul {
  padding: 0;
  list-style: none;
}

header,
nav,
footer {
  margin: 5em auto;
}


/* ==============================
   Links
============================== */

a {
  color: #d80000;
  text-decoration: none;
}

a:visited {
  color: #d80000;
}

a:hover {
  color: #999999;
}

a:active {
  color: #cccccc;
}


/* ==============================
   Decorative dots
============================== */

.dots {
  width: 100%;
  max-width: 330px;
  height: 20px;
  margin-inline: auto;

  background-image:
    radial-gradient(#f0f0f0 10%, transparent 11%);

  background-size: 20px 20px;
  background-position: 50% 50%;
}


/* ==============================
   Header
============================== */

header {
  line-height: 2;
}

header h1 {
  color: #999999;
}

header h1 span {
  color: #d80000;
}

header p {
  margin-top: 2em;
  color: #cccccc;
}


/* ==============================
   Navigation
============================== */

nav ul {
  margin: 4.3em auto;
  color: #cccccc;
}

nav li + li {
  margin-top: 2.6em;
}

.menu-note {
  display: block;
}

hr {
  color: #FFFFFF;
}

hr.over,hr.under {
  height: 1em;
  margin: 0;
  border-style: solid;
  border-color: #8c8b8b;
}

hr.over {
  border-width: 1px 1px 0;
}

hr.under {
  border-width: 0 1px 1px;
}

nav p {
  margin: 4.3em auto;
  color: #999999;
}

/* ==============================
   Footer
============================== */

footer {
  line-height: 2;
  color: #999999;
}

/* ==============================
   Narrow screens
============================== */

@media (max-width: 600px) {
  body {
    padding-inline: 24px;
  }
}