/* https://www.palettable.io/F3F3F1-77C7BF-3A79AB-505050-99D55C */

:root {
  --color0: #F3F3F1;
  --color1: #505050;
  --color2: #99D55C;
  --color3: #04A7AB;
  --color4: #3A79AB;
}

body {
  font-family: 'Noto Sans Japanese', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
  width: 70%;
  margin: auto;
  margin-top: 50px;
  margin-bottom: 50px;
  background-color: var(--color0);
  color: var(--color1);
  align-items: left;
  text-align: left;
}

h1 {
  line-height: 130%;
  padding-top: 5px;
  padding-bottom: 5px;
}

h2 {
  line-height: 240%;
}

h3 {
  padding-top: 24px;
  padding-bottom: 8px;
}

p {
  line-height: 160%;
  font-size: 16px;
  padding-top: 8px;
  padding-bottom: 8px;
  word-break: normal;
}

.header {
  overflow-wrap: break-word;
  /* word-break: break-all; */
}

.header p,
.url p,
.footer p {
  line-height: 290%;
  font-size: 16px;
  padding-top: 0px;
  padding-bottom: 0px;
}

a,
a:link,
a:visited {
  padding-top: 4px;
  padding-bottom: 5px;
  padding-right: 5px;
  padding-left: 5px;
  color: var(--color0);
  background-color: var(--color4);
}

a:hover {
  background-color: var(--color2);
}

ul {
  list-style-position: inside;
}