@charset "UTF-8";
/*
Theme Name: エイム工業
*/
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;700&display=swap");
html,
body {
  margin: 0;
}

li {
  list-style: none;
}

img {
  vertical-align: top;
}

.spacer {
  flex-grow: 1;
}

a:hover {
  opacity: 0.6;
  transition: 0.2s;
}

.grecaptcha-badge {
  visibility: hidden;
}

header {
  display: flex;
  align-items: center;
  width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 600px) {
  header {
    width: 100%;
    padding: 2em 0;
  }
}
@media screen and (max-width: 600px) {
  header .logo {
    margin-left: 1em;
  }
  header .logo img {
    width: 70vw;
  }
}
header input {
  display: none;
}
header input:checked ~ label.menubtn {
  background-color: rgba(0, 0, 0, 0);
}
header input:checked ~ label.menubtn:before {
  top: 50%;
  transform: rotate(135deg);
}
header input:checked ~ label.menubtn:after {
  top: 50%;
  transform: rotate(-135deg);
}
header input:checked ~ nav {
  right: 0;
  max-width: none;
  overflow: scroll;
}
header input:checked ~ .background {
  opacity: 0.5;
  pointer-events: all;
}
header label.menubtn {
  display: none;
}
@media screen and (max-width: 600px) {
  header label.menubtn {
    position: relative;
    display: inline-block;
    z-index: 999;
    width: 10vw;
    height: 4px;
    margin: 0 1em;
    background-color: #000;
  }
  header label.menubtn:before, header label.menubtn:after {
    content: "";
    position: absolute;
    display: block;
    width: 10vw;
    height: 4px;
    background-color: #000;
    transition: 0.3s;
  }
  header label.menubtn:before {
    top: 3vw;
  }
  header label.menubtn:after {
    bottom: 3vw;
  }
}
header nav {
  display: flex;
  padding: 2.5em 0;
}
@media screen and (max-width: 600px) {
  header nav {
    position: absolute;
    top: 0;
    right: -70vw;
    width: 70vw;
    height: 100vh;
    max-width: 0;
    overflow: hidden;
    background-color: #fff;
    flex-direction: column;
    padding-top: 80px;
    transition: 0.3s;
    z-index: 20;
  }
}
header nav li {
  align-items: center;
  text-align: center;
  padding: 0 1em;
  font-weight: 500;
  border-right: 1px solid #000;
}
@media screen and (max-width: 600px) {
  header nav li {
    border-right: none;
    border-bottom: 1px solid #000;
    font-size: 18px;
    padding: 1em;
  }
}
header nav li:last-child {
  border: none;
}
@media screen and (max-width: 600px) {
  header nav li:last-child {
    border-bottom: 1px solid #000;
  }
}
header nav li a {
  text-decoration: none;
  color: inherit;
}
header .background {
  display: none;
}
@media screen and (max-width: 600px) {
  header .background {
    position: fixed;
    top: 0;
    left: 0;
    display: block;
    width: 100vw;
    height: 100vh;
    margin: 0;
    background-color: #000;
    z-index: 10;
    opacity: 0;
    pointer-events: none;
    transition: 0.3s;
  }
}

#top {
  margin-bottom: 80px;
}
#top img {
  width: 100%;
}

#content {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 0 auto 100px;
}
@media screen and (max-width: 600px) {
  #content {
    width: 96%;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto 50px;
  }
}
#content article {
  width: 315px;
}
@media screen and (max-width: 600px) {
  #content article {
    width: 46%;
    margin: 0 2% 3em;
  }
}
#content article img {
  width: 100%;
}
#content article .title {
  font-weight: 700;
  font-size: 20px;
  text-align: center;
  padding: 10px 0;
}
#content article .text {
  font-size: 18px;
  line-height: 30px;
}
#content article.content03 img {
  transform: translateY(-42px);
  margin-bottom: -42px;
}
@media screen and (max-width: 600px) {
  #content article.content03 img {
    transform: translateY(0);
    margin-bottom: 0;
  }
}

#news {
  width: 1000px;
  margin: 0 auto 100px;
}
@media screen and (max-width: 600px) {
  #news {
    width: 96%;
  }
}
#news h2 {
  background-color: #000;
  color: #fff;
  text-align: center;
  font-size: 20px;
  font-weight: 400;
  padding: 7px 0;
  margin: 0;
}
#news article {
  border-bottom: 1px solid #000;
  padding: 12px 0;
}
#news article a {
  display: flex;
  color: #000;
  text-decoration: none;
  font-size: 18px;
}
@media screen and (max-width: 600px) {
  #news article a {
    flex-direction: column;
  }
}
#news article a .date {
  padding: 0 120px 0 40px;
}
@media screen and (max-width: 600px) {
  #news article a .date {
    padding: 0;
  }
}

#about {
  width: 1000px;
  margin: 0 auto 80px;
}
@media screen and (max-width: 600px) {
  #about {
    width: 96%;
  }
}
#about h2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: center;
  font-size: 28px;
  letter-spacing: 6px;
}
#about h2:before, #about h2:after {
  content: "";
  width: 160px;
  height: 6px;
  background-color: #004A99;
}
#about .wrap {
  display: flex;
  justify-content: space-between;
  margin-bottom: 50px;
}
@media screen and (max-width: 600px) {
  #about .wrap {
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0;
  }
}
#about .wrap article {
  width: 250px;
  border: 1px solid #000;
  border-radius: 8px;
  padding: 10px 20px 15px;
}
@media screen and (max-width: 600px) {
  #about .wrap article {
    width: 96%;
    margin: 0 2%;
    margin-bottom: 2em;
  }
}
#about .wrap article h3 {
  font-size: 28px;
  font-weight: 700;
  margin: 0 0 10px 0;
  text-align: center;
}
#about .wrap article h3 span {
  font-size: 36px;
  padding: 0 7px;
}
#about .wrap article .text {
  font-weight: 500;
  font-size: 17px;
}
#about .bnr {
  width: 100%;
}
#about .bnr img {
  width: 100%;
}

#map {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 600px) {
  #map {
    width: 96%;
  }
}
#map article {
  width: 49%;
  margin-bottom: 20px;
}
@media screen and (max-width: 600px) {
  #map article {
    width: 96%;
    margin-bottom: 3em;
  }
}
#map article:first-child {
  margin-right: 2%;
}
#map article h3 {
  background-color: #000;
  color: #fff;
  text-align: center;
  font-size: 18px;
  margin: 0 auto 5px;
}
#map article .addr {
  font-size: 18px;
  font-weight: 700;
  text-align: center;
}
#map article .addr a {
  text-decoration: none;
  color: inherit;
}
#map article .addr iframe {
  width: 100%;
  height: 291px;
  margin-top: 8px;
}

#instagram {
  width: 1000px;
  margin: 100px auto;
}
@media screen and (max-width: 600px) {
  #instagram {
    width: 96%;
    margin: 50px auto;
  }
}

section[id^=page-] {
  padding-bottom: 3em;
}
section[id^=page-] .flex {
  display: flex;
}
section[id^=page-] section {
  width: 800px;
  min-width: 800px;
  margin: 0 auto;
  color: #000;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section {
    width: 96%;
    min-width: auto;
  }
}
section[id^=page-] section h2 {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 24px;
  text-align: center;
}
section[id^=page-] section h2:before, section[id^=page-] section h2:after {
  content: "";
  display: block;
  width: 150px;
  height: 5px;
}
section[id^=page-] section h2.bar {
  display: block;
  color: #fff;
  background-color: #024999;
}
section[id^=page-] section h2.bar:before, section[id^=page-] section h2.bar:after {
  content: "";
}
section[id^=page-] section h2.nomal {
  font-size: 32px;
  margin-bottom: 1em;
}
section[id^=page-] section h2.nomal:before, section[id^=page-] section h2.nomal:after {
  content: "";
  width: 0;
  height: 0;
}
section[id^=page-] section img {
  width: 100%;
}
section[id^=page-] section.page-header {
  width: auto;
  padding-top: 2em;
  margin-bottom: 3em;
  color: #fff;
}
section[id^=page-] section.page-header .flex {
  justify-content: center;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .flex {
    flex-direction: column;
  }
}
section[id^=page-] section.page-header .wrap {
  width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap {
    width: 100%;
  }
}
section[id^=page-] section.page-header .wrap .left h2, section[id^=page-] section.page-header .wrap .left .subtitle, section[id^=page-] section.page-header .wrap .left .text {
  color: #fff;
}
section[id^=page-] section.page-header .wrap .left h2, section[id^=page-] section.page-header .wrap .left .subtitle {
  display: block;
  text-align: right;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap .left h2, section[id^=page-] section.page-header .wrap .left .subtitle {
    text-align: left;
    margin-left: 5vw;
  }
}
section[id^=page-] section.page-header .wrap .left h2 {
  font-size: 56px;
  margin: 0;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap .left h2 {
    margin-left: 5vw;
    font-size: 42px;
  }
}
section[id^=page-] section.page-header .wrap .left h2:before, section[id^=page-] section.page-header .wrap .left h2:after {
  display: none;
}
section[id^=page-] section.page-header .wrap .left .subtitle {
  font-size: 24px;
  font-weight: 500;
  letter-spacing: 0.15em;
  margin-bottom: 1em;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap .left .subtitle {
    font-size: 22px;
  }
}
section[id^=page-] section.page-header .wrap .left .text {
  width: 76.6%;
  margin: 0 0 1em auto;
  font-size: 16px;
  letter-spacing: -0.05em;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap .left .text {
    margin: 0 5vw 1em;
    width: auto;
  }
}
section[id^=page-] section.page-header .wrap .right {
  display: flex;
  align-items: flex-end;
  width: 25%;
  transform: translateY(3%);
  margin-left: 2%;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.page-header .wrap .right {
    width: 50%;
    margin: 0 0 0 auto;
  }
}
section[id^=page-] section.page-header .wrap .right img {
  width: 100%;
}
section[id^=page-] section.content h3, section[id^=page-] section.content .text, section[id^=page-] section.content .flex {
  width: 90%;
  margin: 0 auto;
}
section[id^=page-] section.content h3.full {
  width: 100%;
}
section[id^=page-] section.content div.textbox {
  margin: 1em 0;
}
section[id^=page-] section.content div.title {
  position: relative;
  font-weight: bold;
  font-size: 1.5em;
  margin: 1em 0;
  text-align: center;
}
section[id^=page-] section.content div.title:before, section[id^=page-] section.content div.title:after {
  content: "";
  position: absolute;
  display: inline-block;
  width: 35%;
  height: 7px;
  background-color: #FFE100;
  top: 50%;
  transform: translateY(-50%);
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.content div.title:before, section[id^=page-] section.content div.title:after {
    width: 25%;
  }
}
section[id^=page-] section.content div.title:before {
  left: 5%;
}
section[id^=page-] section.content div.title:after {
  right: 5%;
}
section[id^=page-] section.content .text, section[id^=page-] section.content .flex {
  margin-bottom: 2em;
}
section[id^=page-] section.content .text {
  line-height: 1.6em;
}
section[id^=page-] section.content .text.main {
  font-weight: 500;
}
section[id^=page-] section.content .btn {
  display: inline-block;
  width: 90%;
  border: 2px solid;
  text-decoration: none;
  text-align: center;
  font-size: 1.2em;
  font-weight: bold;
  padding: 1em 0;
  margin: 1em 5%;
}
@media screen and (max-width: 600px) {
  section[id^=page-] section.content .btn {
    width: 100%;
    margin: 1em 0;
  }
}
section[id^=page-] section.content .flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
section[id^=page-] section.content .flex h3 {
  width: 100%;
  margin-bottom: 0.5em;
}
section[id^=page-] section.content .flex .right.text, section[id^=page-] section.content .flex .left.text {
  width: 70%;
  margin: 0;
  margin-bottom: 0;
}
section[id^=page-] section.content .flex .right.img, section[id^=page-] section.content .flex .left.img {
  width: 25%;
}
section[id^=page-] section.content .flex .right.img img, section[id^=page-] section.content .flex .left.img img {
  width: 100%;
}
section[id^=page-] section.content .flex .right .img {
  margin-left: 3%;
}
section[id^=page-] section.content .flex .left .img {
  margin-right: 3%;
}
section[id^=page-] section.content .flex.two-way, section[id^=page-] section.content .flex.three-way {
  margin-bottom: 1em;
}
section[id^=page-] section.content .flex.two-way img, section[id^=page-] section.content .flex.three-way img {
  margin: 0;
}
section[id^=page-] section.content .flex.two-way img {
  width: 49%;
}
section[id^=page-] section.content .flex.three-way img {
  width: 30%;
}
section[id^=page-] section.content .flex.wrap {
  flex-wrap: wrap;
}
section[id^=page-] section.content .flex.wrap article {
  width: 49%;
}
section[id^=page-] section.content .flex-top {
  align-items: flex-start;
}
section[id^=page-] section.content img {
  margin: 1em 0;
}
section[id^=page-] section.content table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  margin-bottom: 3em;
}
section[id^=page-] section.content table th, section[id^=page-] section.content table td {
  border-bottom: 1px solid #000;
  padding: 0.25em 0;
  font-weight: 400;
}
section[id^=page-] section.content table th {
  width: 25%;
  text-align: left;
  padding-left: 1.5em;
}
section[id^=page-] section.content table td {
  width: 75%;
}

section#page-business section h2 {
  color: #024999;
}
section#page-business section h2:before, section#page-business section h2:after {
  background-color: #024999;
}
section#page-business section h2.bar {
  background-color: #024999;
  color: #fff;
}
@media screen and (max-width: 600px) {
  section#page-business section h2 span {
    display: inline-block;
  }
  section#page-business section h2:before, section#page-business section h2:after {
    width: 15%;
  }
}
section#page-business section.page-header {
  background-color: #024999;
}
section#page-business section.page-header h2 {
  color: #fff;
}
section#page-business section.content h3 {
  color: #024999;
}

section#page-about section h2:before, section#page-about section h2:after {
  background-color: #E50012;
}
section#page-about section h2.bar {
  background-color: #E50012;
}
section#page-about section.page-header {
  background-color: #E50012;
}
section#page-about section.page-header .left {
  margin-bottom: 1em;
}
section#page-about section.page-header .left .text {
  width: 100%;
  text-align: right;
}
@media screen and (max-width: 600px) {
  section#page-about section.page-header .left .text {
    width: auto;
    text-align: left;
  }
}
section#page-about section.page-header .right {
  display: flex;
  align-items: flex-end;
  width: 29%;
  margin-left: 1%;
}
@media screen and (max-width: 600px) {
  section#page-about section.page-header .right {
    width: 50%;
    margin: 0 0 0 auto;
  }
}
section#page-about section.page-header .right img {
  width: 100%;
}
section#page-about section.content h3 {
  color: #E50012;
}
@media screen and (max-width: 600px) {
  section#page-about section.content .president {
    width: 96%;
    flex-direction: column;
  }
  section#page-about section.content .president .left {
    width: 60%;
    margin: 0 20%;
  }
  section#page-about section.content .president .right {
    width: 100%;
  }
}
@media screen and (max-width: 600px) {
  section#page-about section table tr {
    display: flex;
    flex-direction: column;
  }
  section#page-about section table tr th, section#page-about section table tr td {
    width: 100%;
    padding-left: 1em;
    box-sizing: border-box;
  }
  section#page-about section table tr th {
    background-color: #000;
    color: #fff;
  }
  section#page-about section table tr td {
    padding-top: 0.5em;
    padding-bottom: 1em;
  }
}
section#page-about section#map {
  width: 800px;
  min-width: 800px;
}
@media screen and (max-width: 600px) {
  section#page-about section#map {
    width: 96%;
    min-width: auto;
  }
}

section#page-recruitment section h2 {
  color: #000;
}
section#page-recruitment section h2:before, section#page-recruitment section h2:after {
  background-color: #FFE100;
}
section#page-recruitment section h2.bar {
  background-color: #FFE100;
}
section#page-recruitment section.page-header {
  background-color: #FFE100;
  margin: 0;
}
section#page-recruitment section.page-header .left {
  margin-bottom: 1em;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.page-header .left {
    margin: 0;
  }
}
section#page-recruitment section.page-header .left h2, section#page-recruitment section.page-header .left .subtitle, section#page-recruitment section.page-header .left .text {
  color: #000;
}
section#page-recruitment section.page-header .left h2 br, section#page-recruitment section.page-header .left .subtitle br, section#page-recruitment section.page-header .left .text br {
  display: block;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.page-header .left h2 br, section#page-recruitment section.page-header .left .subtitle br, section#page-recruitment section.page-header .left .text br {
    display: block;
  }
}
section#page-recruitment section.page-header .left .subtitle br {
  display: none;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.page-header .left .subtitle br {
    display: block;
  }
}
section#page-recruitment section.page-header .left .text {
  width: 100%;
  text-align: right;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.page-header .left .text {
    width: auto;
    text-align: left;
    margin-left: 1.2em;
    margin-bottom: 0;
  }
}
section#page-recruitment section.page-header .right {
  display: flex;
  align-items: flex-end;
  width: 29%;
  margin-left: 1%;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.page-header .right {
    width: 60%;
    margin: 0 0 0 auto;
  }
}
section#page-recruitment section.page-header .right img {
  width: 100%;
}
section#page-recruitment section.content h2 {
  border: 2px solid #000;
}
section#page-recruitment section.content h3 {
  background-color: #FFE100;
  color: #000;
  text-align: center;
  font-size: 18px;
  font-weight: 500;
}
section#page-recruitment section.content h3.bar {
  color: #fff;
  background-color: #000;
  font-weight: 700;
}
section#page-recruitment section.content .flex {
  width: 100%;
  align-items: flex-start;
  margin: 0 0 3em 0;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.content .flex {
    flex-direction: column;
  }
}
section#page-recruitment section.content .flex h3 {
  margin: 0;
}
section#page-recruitment section.content .flex .img {
  width: 35%;
}
section#page-recruitment section.content .flex .img img {
  margin: 0;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.content .flex .img {
    width: 50%;
    margin: 1em 25%;
    order: 1;
  }
}
section#page-recruitment section.content .flex .text {
  width: 65%;
  font-size: 14px;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.content .flex .text {
    width: 100%;
    order: 2;
  }
}
section#page-recruitment section.content .flex .text div {
  padding: 1em 2em;
}
@media screen and (max-width: 600px) {
  section#page-recruitment section.content article {
    width: 96%;
    margin-bottom: 2em;
  }
}
section#page-recruitment section.content table {
  margin: 1em 0 0;
}
section#page-recruitment section.content table th {
  width: 4em;
  padding: 0.25em 2em 0.25em 1em;
  text-align-last: justify;
  vertical-align: top;
}
section#page-recruitment section.content table td {
  width: auto;
}
section#page-recruitment section.content a {
  display: inline-block;
  text-align: center;
  width: 70%;
  margin: 1.5em 15%;
  padding: 0.2em;
  background-color: #FFE100;
  border: 2px solid #000;
  border-radius: 8px;
  text-decoration: none;
  color: #000;
}

section#page-contact section h2:before, section#page-contact section h2:after {
  background-color: #006934;
}
section#page-contact section h2.bar {
  background-color: #006934;
}
section#page-contact section.page-header {
  background-color: #006934;
}
section#page-contact section.page-header h2 {
  display: block;
  font-size: 56px;
  text-align: center;
  margin: 0;
  padding: 0 0 0.5em;
}
section#page-contact section.page-header h2:before, section#page-contact section.page-header h2:after {
  display: none;
}
section#page-contact section.page-header img {
  width: 50%;
  margin: 0 25%;
}
section#page-contact section.content h3 {
  color: #006934;
}
section#page-contact section.content .annotation {
  padding: 1.5em 1em;
  color: #333;
  border: 1px solid #ccc;
  font-size: 14px;
}
section#page-contact section.content article {
  border-bottom: 1px dotted #ccc;
  width: 86%;
  margin: 0 7%;
  padding: 2em 0;
  color: #333;
}
section#page-contact section.content article:nth-child(8) {
  border: none;
}
section#page-contact section.content article .req:after {
  content: "※";
  color: red;
  font-size: 12px;
}
section#page-contact section.content article .sub {
  font-size: 14px;
  color: #f2afc1;
}
section#page-contact section.content article .tel1, section#page-contact section.content article .tel2, section#page-contact section.content article .tel3 {
  width: 28%;
  margin-right: 3%;
}
section#page-contact section.content article .tel1 input, section#page-contact section.content article .tel2 input, section#page-contact section.content article .tel3 input {
  width: 100% !important;
}
@media screen and (max-width: 600px) {
  section#page-contact section.content article .tel1 input, section#page-contact section.content article .tel2 input, section#page-contact section.content article .tel3 input {
    width: 90% !important;
  }
}
section#page-contact section.content article input, section#page-contact section.content article textarea {
  font-size: 16px;
  padding: 0.5em 0;
  margin: 0.5em 0;
  padding: 0.5em;
  border: 1px solid #aaa;
  border-radius: 1px;
}
section#page-contact section.content article input.max, section#page-contact section.content article textarea.max {
  width: calc(100% - 1em);
}
section#page-contact section.content article input.half, section#page-contact section.content article textarea.half {
  width: 50%;
}
section#page-contact section.content article input.min, section#page-contact section.content article textarea.min {
  width: 25%;
}
section#page-contact section.content article input.telinp, section#page-contact section.content article textarea.telinp {
  width: 11em;
}
@media screen and (max-width: 600px) {
  section#page-contact section.content article input.telinp, section#page-contact section.content article textarea.telinp {
    width: 5em !important;
  }
}
section#page-contact section.content article .flex {
  width: 90%;
  margin: 0 auto 0 0;
}
@media screen and (max-width: 600px) {
  section#page-contact section.content article .flex {
    width: 100%;
  }
  section#page-contact section.content article .flex input {
    width: 27%;
  }
}
section#page-contact section.content article .remarks {
  font-size: 0.8em;
  color: #888;
}
section#page-contact section.content input[type=button], section#page-contact section.content input[type=submit] {
  display: none;
}
section#page-contact section.content .btn {
  display: inline-block;
  width: 50%;
  margin: 0 25%;
  text-align: center;
  background-color: #006934;
  color: #fff;
  font-weight: 700;
  font-size: 18px;
  padding: 0.75em 0;
  border-radius: 3px;
}
section#page-contact section.content .btn:hover {
  opacity: 0.6;
  transition: 0.3s;
}
section#page-contact section#map {
  width: 800px;
  min-width: 800px;
}

section#page-contribution section h2 {
  color: #F15A24;
}
section#page-contribution section h2:before, section#page-contribution section h2:after {
  background-color: #F15A24;
}
section#page-contribution section h2.bar {
  background-color: #F15A24;
  color: #fff;
}
@media screen and (max-width: 600px) {
  section#page-contribution section h2 span {
    display: inline-block;
  }
  section#page-contribution section h2:before, section#page-contribution section h2:after {
    width: 15%;
  }
}
section#page-contribution section.page-header {
  background-color: #F15A24;
}
section#page-contribution section.page-header h2 {
  color: #fff;
  text-align: left;
}
section#page-contribution section.page-header .subtitle, section#page-contribution section.page-header .text {
  text-align: left;
  margin: 0 0 1em 0;
}
@media screen and (max-width: 600px) {
  section#page-contribution section.page-header .subtitle, section#page-contribution section.page-header .text {
    margin: 0 0 1em 5vw;
  }
}
section#page-contribution section.content h3 {
  color: #F15A24;
}

#single {
  width: 800px;
  min-width: auto;
  margin: 5em auto 10em;
}
@media screen and (max-width: 600px) {
  #single {
    width: 94vw;
    margin: 3em auto 5em;
  }
}
#single article h2 {
  margin: 1em 0 0.5em;
  padding: 0.5em 0;
  border-bottom: 2px solid #000;
}
#single article h2:before {
  content: "□ ";
}
#single article .date {
  margin: 0 0 2em 0;
  text-align: right;
}
#single a.back {
  display: block;
  width: 300px;
  margin: 5em auto 0;
  padding: 0.5em 0;
  text-decoration: none;
  background-color: #000;
  color: #fff;
  text-align: center;
}

footer {
  width: 1000px;
  margin: 20px auto 150px;
}
@media screen and (max-width: 600px) {
  footer {
    width: 96%;
    margin: 20px auto 100px;
  }
}
footer nav {
  display: flex;
  margin-bottom: 40px;
}
@media screen and (max-width: 600px) {
  footer nav {
    flex-wrap: wrap;
    justify-content: center;
  }
}
footer nav li {
  width: 20%;
  padding: 8px 0;
  text-align: center;
  border-right: 1px solid #000;
  font-size: 16px;
  font-weight: 500;
}
@media screen and (max-width: 600px) {
  footer nav li {
    width: 32%;
    margin-bottom: 1.5em;
    border-right: none;
  }
}
footer nav li:last-child {
  border-right: none;
}
footer nav a {
  text-decoration: none;
  color: inherit;
}
footer .logo {
  text-align: center;
}
footer .logo img {
  width: 40%;
}
@media screen and (max-width: 600px) {
  footer .logo img {
    width: 80%;
  }
}

html {
  font-family: "Noto Sans JP", sans-serif;
}

header, section, footer {
  min-width: 1000px;
}
@media screen and (max-width: 600px) {
  header, section, footer {
    min-width: auto;
  }
}