#news .newsWrap {
  max-height: 30rem;
  padding: 1.5rem;
  background-color: #FFF;
  border: solid 2px #CCC;
  overflow-y: auto;
}
#news li {
  margin-bottom: 1.5rem;
  border-bottom: solid 1px #999;
  position: relative;
}
#news li .postTitle {
  font-size: 1.3rem;
  line-height: 1.3;
  margin: 0.5rem 0 1rem;
}
#news li .postTitle a {
  color: #036BB3;
  font-size: inherit;
}
#news li .postDate {
  line-height: 1;
  position: absolute;
  right: 0;
  top: 0;
}
#news .btnWrap {
  margin-bottom: 0;
}
body.children #news .btnWrap .btn {
  background-color: #CF7C00;
}
body.culture #news .btnWrap .btn {
  background-color: #992646;
}
body.environment #news .btnWrap .btn {
  background-color: #036BB3;
}

@media print, screen and (min-width: 600px) {
  #news .newsWrap {
    width: 80%;
    max-width: 800px;
    margin: 0 auto;
    padding: 2% 4%;
  }
  #news li {
    margin-bottom: 15px;
  }
  #news li .postTitle {
    margin-bottom: 15px;
  }
}
@media print, screen and (min-width: 1200px) {
  #news li {
    -js-display: flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  #news li .catWrap {
    width: 100px;
    flex-shrink: 0;
  }
  #news li .postTitle {
    font-size: 1.5rem;
    font-weight: 400;
    margin-top: 0;
    flex-grow: 1;
  }
  #news li .postTitle a {
    color: #333;
  }
  #news li .postTitle a:hover {
    color: #036BB3;
    text-decoration: underline;
  }
  #news li .postDate {
    color: #423461;
    font-size: 1.5rem;
    text-align: right;
    width: 150px;
    position: relative;
    right: auto;
    top: auto;
    flex-shrink: 0;
  }
}
.homeMenu {
  display: none;
}

.mainVisual {
  color: #FFF;
  height: calc( 100vh - 60px);
  max-height: 768px;
  background-image: url("../img/top/bg-header.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.mainVisual .inner-box {
  height: 100%;
  position: relative;
}
.mainVisual .title {
  text-align: center;
  text-shadow: 1px 1px 4px rgba(0, 0, 0, 0.6), 1px -1px 4px rgba(0, 0, 0, 0.6), -1px 1px 4px rgba(0, 0, 0, 0.6), -1px -1px 4px rgba(0, 0, 0, 0.6);
  width: 100%;
  position: absolute;
  left: 0;
  top: 28%;
}
.mainVisual h1 {
  font-family: 'Roboto', "Helvetica Neue", HelveticaNeue, 'Noto Sans JP', YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
  font-size: 3.2rem;
  letter-spacing: 0.07em;
  margin-bottom: 0.2em;
}
.mainVisual h1 span {
  font-size: 0.9em;
}
.mainVisual .year,
.mainVisual .lead {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.3rem;
  letter-spacing: 0.15em;
}
.mainVisual .lead {
  font-size: 1.6rem;
  text-align: center;
  line-height: 2.4;
  width: 100%;
  height: 56%;
  padding: 0 3rem;
  -js-display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
  position: absolute;
  left: 0;
  bottom: 0;
}

#index ul {
  -js-display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: space-between;
  justify-content: space-between;
}
#index ul li {
  width: 32%;
  margin: 0;
}
#index ul li a {
  height: 100%;
  display: block;
  padding-bottom: 3rem;
  background-color: #FFF;
  border-style: solid;
  border-width: 1px;
  position: relative;
}
#index ul li .title {
  width: 100%;
  padding: 1rem 0;
  border: solid 1px #FFF;
  border-bottom: none;
  -js-display: flex;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-align-items: center;
  align-items: center;
}
#index ul li .title h4 {
  font-family: 'Noto Serif JP', serif;
  color: #FFF;
  font-size: 1.25rem;
  text-align: center;
  line-height: 1;
  letter-spacing: 0.05em;
  margin-bottom: 0;
}
#index ul li .title h4 span {
  font-size: 0.7em;
  margin-bottom: 0.5em;
  display: block;
}
#index ul li .imgBox {
  border-left: solid 1px #FFF;
  border-right: solid 1px #FFF;
  display: block;
}
#index ul li .textBox {
  padding: 0.5rem;
  display: block;
}
#index ul li .textBox p {
  font-size: 1.1rem;
  line-height: 1.3;
  margin-bottom: 0;
}
#index ul li .linkBox {
  color: #FFF;
  font-size: 1.1rem;
  font-weight: 400;
  text-align: center;
  line-height: 1;
  text-indent: -0.5em;
  width: 100%;
  padding: 0.7em 0 0.75em;
  display: block;
  border: solid 1px #FFF;
  background-image: url("../img/common/arrow-right.svg");
  background-repeat: no-repeat;
  background-position: right center;
  background-size: auto 50%;
  position: absolute;
  left: 0;
  bottom: 0;
}
#index ul li.children a {
  border-color: #CF7C00;
}
#index ul li.children .title,
#index ul li.children .linkBox {
  background-color: #CF7C00;
}
#index ul li.culture a {
  border-color: #992646;
}
#index ul li.culture .title,
#index ul li.culture .linkBox {
  background-color: #992646;
}
#index ul li.environment a {
  border-color: #036BB3;
}
#index ul li.environment .title,
#index ul li.environment .linkBox {
  background-color: #036BB3;
}

#about .col .imgBox {
  margin-bottom: 2rem;
}
#about .col .imgBox img {
  width: 60%;
  margin: 0 auto;
  display: block;
}
#about .col .imgBox figcaption {
  text-align: center;
}
#about .col .btnWrap {
  margin-bottom: 1rem;
}
#about .col .btnWrap .btn {
  background-color: #604C3F;
}

#news {
  padding-bottom: 3rem;
  background-color: #F7F7F9;
}
#news .newsWrap {
  border: solid 2px #423461;
}

#aboutus .sig {
  padding-left: 1.2rem;
  border-left: 4px solid #006934;
}
#aboutus .sig h5 {
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 0.5em;
}
#aboutus .sig .name {
  font-size: 1.5rem;
}
#aboutus .sig .name span {
  font-size: 0.8em;
  margin-right: 1em;
}
#aboutus .btnWrap .btn {
  background-color: #006934;
}

#picture {
  padding-bottom: 5rem;
}
#picture .col {
  padding: 1.5rem;
  border: solid 5px #D9D6DF;
}
#picture .col .popup {
  text-align: center;
  width: 50%;
  margin: 0 auto 1rem;
  display: block;
}
#picture .col p {
  line-height: 1.5;
  margin-bottom: 0;
}

@media print, screen and (min-width: 600px) {
  .mainVisual {
    height: 50vw;
  }

  #index {
    padding-bottom: 0;
  }
  #index ul li a {
    padding-bottom: 5rem;
  }
  #index ul li .title {
    width: 100%;
    padding: 1.5rem 0;
  }
  #index ul li .title h4 {
    font-size: 1.8rem;
  }
  #index ul li .textBox {
    padding: 1.5rem;
  }
  #index ul li .textBox p {
    font-size: 1.4rem;
    line-height: 1.6;
  }
  #index ul li .linkBox {
    font-size: 1.4rem;
    text-indent: 0;
    padding: 1em 0 1.05em;
  }

  #about .col {
    -js-display: flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  #about .col .imgBox {
    width: 18%;
    margin-bottom: 0;
    padding-top: 1%;
  }
  #about .col .imgBox img {
    width: 100%;
    margin: 0;
  }
  #about .col .textBox {
    width: 77%;
  }
  #about .col .btnWrap {
    text-align: left;
    margin-bottom: 0;
  }

  #news {
    padding-bottom: 8vw;
  }

  #aboutus .col {
    -js-display: flex;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between;
  }
  #aboutus .col .imgBox {
    width: 45.4%;
    margin-bottom: 0;
    padding-top: 1%;
  }
  #aboutus .col .textBox {
    width: 50.5%;
    position: relative;
  }
  #aboutus .sig {
    position: absolute;
    left: 0;
    bottom: 0;
  }

  #picture .col {
    width: 80%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    padding: 4%;
  }
}
@media print, screen and (min-width: 1200px) {
  .header {
    height: 60px;
  }
  .header .nav-main {
    display: none;
  }

  .homeMenu {
    display: block;
  }
  .homeMenu .nav-main {
    border-top: none;
    border-bottom: solid 1px #423461;
    position: relative;
    left: auto;
    bottom: auto;
  }

  .mainVisual .title {
    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.4), 2px -2px 6px rgba(0, 0, 0, 0.4), -2px 2px 6px rgba(0, 0, 0, 0.4), -2px -2px 6px rgba(0, 0, 0, 0.4);
  }
  .mainVisual h1 {
    font-size: 68px;
  }
  .mainVisual .year {
    font-size: 30px;
  }
  .mainVisual .lead {
    font-size: 25px;
  }

  #index ul li a {
    padding-bottom: 64px;
    border-width: 2px;
  }
  #index ul li a:hover .linkBox {
    opacity: 0.7;
  }
  #index ul li .title {
    border-width: 2px;
  }
  #index ul li .title h4 {
    font-size: 2.6rem;
  }
  #index ul li .imgBox {
    border-width: 2px;
  }
  #index ul li .textBox {
    padding: 18px 24px;
  }
  #index ul li .textBox p {
    font-size: 1.6rem;
  }
  #index ul li .linkBox {
    font-size: 2rem;
    border-width: 2px;
    transition: opacity 0.3s;
  }

  #aboutus .sig h5 {
    font-size: 1.6rem;
  }
  #aboutus .sig .name {
    font-size: 1.9rem;
  }

  #picture {
    padding-bottom: 10rem;
  }
}

/*# sourceMappingURL=top.css.map */