@charset "UTF-8";

/* header
================================================= */
header {
  width: min(90%, 820px);
  margin: 8% auto 0;
}
header h1 img {
  width: 65%;
	margin: 0 auto;	
}
@media print, screen and (min-width: 600px) {
  header { margin-top: 7%; }
  header h1 img { width: 50%; }
}
@media print, screen and (min-width: 960px) {
  header { margin-top: 70px; }
}


/* main
================================================= */
main {
  width: min(90%, 820px);
  margin: 5% auto 8%;
  padding: 5%;
  background: #fff;
}
main > * + * {
  margin-top: 11vw;
}
@media print, screen and (min-width: 600px) {
  main { margin: 5% auto 7%; }
  main > * + * { margin-top: 7vw; }
}
@media print, screen and (min-width: 960px) {
  main { margin: 50px auto 70px; padding: 50px; }
  main > * + * { margin-top: 80px; }
}

/* text decoration */
.text-smallest {
  font-size: 0.7em;
}
.text-small {
  font-size: 0.85em;
}
.text-large {
  font-size: 1.25em;
}
.text-largest {
  font-size: 1.4em;
}
.text-bold {
  font-weight: bold;
}
.text-red {
  color: #C80028;
}
.text-center {
  text-align: center;
}

/* h2 - h4 */
h2,
h3,
h4 {
  line-height: 1.5;
}
h2 {
  margin-bottom: 0.6em;
	padding: 0.3em 0.6em;
	border-radius: 3px;
	background: #959595;
  color: #fff;
  font-size: 1.25em;
}
h3 {
  margin: 1.4em 0 0.2em;
  font-size: 1.1em;
}
h4 {
  margin: 0.5em 0 0.2em;
  font-size: 1.0em;
} 
h2 + h3,
h3 + h4 {
  margin-top: 0;
}

/* ul & ol */
ul,
ol {
  margin: 0;
  padding: 0 0 0 1.6em;
}
li + li {
  margin-top: 0.2em;
}
li > ul li + li,
li > ol li + li {
  margin-top: 0;
}

/* p */
p + p,
ul + p,
ol + p {
  margin-top: 0.8rem;
}