@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=M+PLUS+Rounded+1c:wght@400;700&family=Noto+Sans+JP:wght@400;700&family=Noto+Serif+JP:wght@400;700&display=swap");
html {
  background-color: white;
  scroll-behavior: smooth;
}
html body {
  font-size: 1.4vw;
  overflow-x: hidden;
  -webkit-text-size-adjust: none;
}
html h1, html h2, html h3, html h4, html h5, html h6 {
  font-size: 100%;
  font-weight: normal;
}
html .t_left {
  text-align: left;
}
html .t_center {
  text-align: center;
}
html .t_right {
  text-align: right;
}
html .indent {
  text-indent: 1.4vw;
  letter-spacing: .1vw;
}
html .indent p {
  margin-bottom: 1%;
}
html .rev_indent {
  text-indent: -1.4vw;
  padding-left: 1.4vw;
}
html .rev_indent.rev2 {
  text-indent: -3vw;
  padding-left: 3vw;
}
html .rev_indent.rev3 {
  text-indent: -6vw;
  padding-left: 6vw;
}
html ul.marklist, html ol.marklist {
  list-style: none;
  text-indent: -1.4vw;
  padding-left: 1.4vw;
}
html ul.marklist.big, html ol.marklist.big {
  text-indent: -3vw;
  padding-left: 3vw;
}

.imgover100 img {
  width: 100% !important;
}

.pc {
  display: block;
}
.pc.il {
  display: inline;
}
.pc.ilb {
  display: inline-block;
}

.sp {
  display: none;
}

.center {
  text-align: center;
}

.right {
  text-align: right;
}

.sasikae {
  border: 2px solid red;
}
.sasikae:after {
  content: "差替予定-変更したらclass [sasikae]は削除";
  color: red;
  display: block;
}

.chousei {
  position: relative;
}
.chousei:before {
  content: "調整中";
  color: white;
  background: #c0c0c0;
  border: 2px solid #c0c0c0;
  display: block;
  width: 30%;
  position: absolute;
  top: 10%;
  left: 35%;
  font-size: 3rem;
  padding: .5% 2%;
  font-weight: bold;
  z-index: 10000;
  text-align: center;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.betukiji {
  position: relative;
  border: 5px solid #ff00ff;
}
.betukiji:before {
  content: "調整中";
  color: red;
  background: white;
  border: 2px solid red;
  display: block;
  width: 30%;
  position: absolute;
  top: 10%;
  left: 35%;
  font-size: 3rem;
  padding: 1% 3%;
  font-weight: bold;
  z-index: 10000;
  text-align: center;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}
.betukiji:before {
  content: "記事を別途お送りします。";
  color: blue;
  background: white;
  border: 2px solid blue;
  display: block;
  width: 70%;
  position: absolute;
  top: 3%;
  left: 9%;
  font-size: 3rem;
  padding: 1% 3%;
  font-weight: bold;
  z-index: 10000;
  text-align: center;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.kakunin {
  position: relative;
}
.kakunin:before {
  content: "確認中";
  color: red;
  background: white;
  border: 2px solid red;
  display: block;
  width: 30%;
  position: absolute;
  top: 0%;
  left: 35%;
  font-size: 2rem;
  padding: 1% 3%;
  font-weight: bold;
  z-index: 10000;
  text-align: center;
  font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}

.no-image {
  position: relative;
}
.no-image:before {
  content: "＜準備中＞";
  color: white;
  margin: auto;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  text-align: right;
  width: 90%;
  padding: 5%;
  margin: auto;
  z-index: 2;
}
.no-image:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  background: #c0c0c0 !important;
  left: 0;
}

@media screen and (min-width: 1500px) {
  html body {
    font-size: 22px;
  }
  html .indent {
    text-indent: 22px;
    letter-spacing: .1px;
  }
  html .rev_indent {
    text-indent: -22px;
    padding-left: 22px;
  }
  html .rev_indent.rev2 {
    text-indent: -45px;
    padding-left: 45px;
  }
  html .rev_indent.rev3 {
    text-indent: -60px;
    padding-left: 60px;
  }
  html ul.marklist, html ol.marklist {
    list-style: none;
    text-indent: -22px;
    padding-left: 22px;
  }
  html ul.marklist.big, html ol.marklist.big {
    text-indent: -45px;
    padding-left: 45px;
  }

  .page2nd .category .list .bgblock {
    width: 30%;
    padding-top: 30%;
  }
}
html, .top #topics h2.title span,
.top .top_block h2.title span {
  font-family: 'メイリオ', 'Meiryo','Noto Sans JP','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}

.top #topics .block .block_left .box .box_in span,
.top .top_block .block .block_left .box .box_in span, .page2nd .content_block h2.title span, .page2nd .link_block.press a:before, .page2nd .link_block.news a:before {
  font-family: "Arial", serif;
}

.page2nd .books .book a.flex h4, .page2nd .books .book a.flex .circle_catch {
  font-family: 'M PLUS Rounded 1c', sans-serif;
  transform: rotate(0.03deg);
}

.top #topics h2.title,
.top .top_block h2.title {
  color: white;
  transition: 1s;
  text-decoration: underline;
}
.top #topics h2.title:hover,
.top .top_block h2.title:hover {
  color: #0066ff;
}

img {
  max-width: 100%;
}

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

/* ヘッダーメニュー */
header {
  position: fixed;
  width: 100px;
  width: 20%;
  height: 100vh;
  border-right: 1px solid #fff;
  border-right: 1px solid rgba(255, 255, 255, 0.3);
  transition: .7s;
  /*hove時に１秒かけて動く*/
  z-index: 9000;
  overflow: auto;
  background-color: rgba(65, 105, 225, 0.8);
  scrollbar-color: #ddd #fff;
  scrollbar-width: thin;
  /*facebookやtwitterなどのアイコンブロック
---------------------------------------------------------------------------*/
  /*アイコンを囲むブロック全体の設定*/
}
header::-webkit-scrollbar {
  width: 16px;
}
header::-webkit-scrollbar-track {
  background-color: #ddd;
  border-radius: 0x;
}
header::-webkit-scrollbar-thumb {
  background-color: #fff;
  border-radius: 100px;
}
header nav#menubar ul li {
  transition: 1s;
  /*hove時に１秒かけて動く*/
}
header nav#menubar ul li:hover {
  background-color: #0066ff;
}
header nav#menubar ul li a {
  overflow: hidden;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-right: 5%;
  color: white;
  height: 100px;
  text-decoration: none;
}
header nav#menubar ul li a span {
  padding-left: 100px;
  display: block;
  transition: 2s;
  /*hove時に１秒かけて動く*/
}
header.on {
  width: 20%;
  overflow: auto;
  background-color: royalblue;
}
header.on nav#menubar ul li {
  transition: 1s;
  /*hove時に１秒かけて動く*/
}
header.on nav#menubar ul li:hover {
  background-color: #0066ff;
}
header.on nav#menubar ul li a {
  overflow: hidden;
  width: 100%;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding-right: 5%;
  color: white;
  text-decoration: none;
}
header.on nav#menubar ul li a span {
  padding-left: 100px;
  display: block;
  transition: 2s;
  /*hove時に１秒かけて動く*/
}
header h1 {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid white;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
header h1 a {
  padding: 5% 0;
  display: block;
  text-align: center;
}
header h1 img {
  width: 100px;
  margin: auto;
}
header nav#menubar ul {
  list-style-type: none;
  padding: 0;
  margin: 0;
}
header nav#menubar ul li {
  list-style-type: none;
  border-bottom: 1px solid white;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
header nav#menubar ul li.menuimg {
  background-repeat: no-repeat;
  background-size: 50px 50px;
  background-position: 25px 25px;
}
header nav#menubar ul li.menu0 {
  background-image: url("/environment/ourecoact/img/icon/tane.png");
}
header nav#menubar ul li.menu1 {
  background-image: url(/environment/ourecoact/img/icon/sec01.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu2 {
  background-image: url(/environment/ourecoact/img/icon/sec02.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu3 {
  background-image: url(/environment/ourecoact/img/icon/sec03.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu4 {
  background-image: url(/environment/ourecoact/img/icon/sec04.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu5 {
  background-image: url(/environment/ourecoact/img/icon/sec05.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu6 {
  background-image: url(/environment/ourecoact/img/icon/sec06.png);
  /*背景画像の読み込み*/
}
header nav#menubar ul li.menu6 a span {
  font-family: "Kaisei Opti", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 120%;
}
header nav#menubar ul li.menu6 a span.colorful em {
	font-style: normal;
}
header nav#menubar ul li.menu6 a span.colorful em:nth-child(1) { color: #50e2b2; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(2) { color: #ffe551; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(3) { color: #aee432; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(4n) { color: #fff; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(4n+1) { color: #50e2b2; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(4n+2) { color: #ffe551; }
header nav#menubar ul li.menu6 a span.colorful em:nth-child(4n+3) { color: #aee432; }
header nav#menubar ul li.current {
  background-color: rgba(0, 102, 255, 0.5);
}
header .icon {
  margin: 0;
  text-align: center;
  /*内容をセンタリング*/
  padding: 10px 0;
  /*上下、左右への余白*/
}
header .icon li {
  display: inline;
  /*横並びにさせる指定*/
}
header .icon img {
  width: 20%;
  /*画像の幅*/
}

.nav_okiden_link {
  text-align: center;
}
.nav_okiden_link a {
  color: #fff;
  color: white;
  text-decoration: none;
}
.nav_okiden_link a:hover {
  color: #06f;
  color: rgba(255, 255, 255, 0.6);
}

footer {
  padding: 1%;
  text-align: right;
  font-size: 80%;
  color: white;
  font-weight: normal;
  margin-right: 55px;
  text-shadow: 1px 1px 2px black;
}
footer a {
  color: white;
}

.nav-fix-pos-pagetop {
  position: fixed;
  z-index: 10000;
  display: block;
  bottom: 0;
  right: 0;
}
.nav-fix-pos-pagetop a {
  text-align: center;
  margin: 5px;
  width: 50px;
  height: 50px;
  color: white;
  text-decoration: none;
  line-height: 50px;
  font-size: 30px;
  border: 1px solid white;
  border-radius: 25px;
  display: inline-block;
  transition: 1s;
}
.nav-fix-pos-pagetop a:hover {
  background-color: white;
  color: #0066ff;
}

/*mainブロック
---------------------------------------------------------------------------*/
/*アニメーション設定------------------------*/
@keyframes main {
  /*0コマ目*/
  0% {
    opacity: 0;
    top: 20px;
  }
  /*100コマ目*/
  100% {
    opacity: 1;
    top: 0px;
  }
}
/*mainブロック*/
#main {
  padding: 2% 5% 0 20%;
  /*上、右、下、左へのブロック内の余白*/
  animation-duration: 0.5S;
  /*アニメーションの実行時間。秒。*/
  animation-fill-mode: both;
  /*アニメーションの待機中は最初のキーフレームを、完了後は最後のキーフレームを維持する*/
  animation-name: main;
  /*上のアニメーション設定で使っているkeyframesの名前。contents。*/
  animation-delay: 0.1s;
  /*アニメーションを遅れて開始させる指定。0.5sは0.5秒の事。*/
  position: relative;
  max-width: 1500px;
  margin: auto;
}

@media screen and (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}
.top .toplogo {
  padding: 3% 0;
  text-align: center;
  height: 50vh;
  width: 35%;
  margin: auto;
  margin-bottom: 30vh;
}
.top .toplogo img {
  margin: auto;
  height: auto;
}
.top #topics,
.top .top_block {
  border: 1px solid white;
  border: 1px solid rgba(255, 255, 255, 0.3);
  background-color: #4169e1;
  background-color: rgba(65, 105, 225, 0.6);
  color: white;
  padding: 5%;
}
.top #topics h2.title,
.top .top_block h2.title {
  padding: 0 0 4%;
  border-bottom: 1px solid white;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  font-weight: normal;
  font-size: 200%;
  text-align: center;
  text-decoration: none;
}
.top #topics h2.title span,
.top .top_block h2.title span {
  line-height: 200%;
  font-size: 50%;
  display: block;
}
.top #topics h2.title:hover,
.top .top_block h2.title:hover {
  color: white;
  text-shadow: 0 0 10px white;
}
.top #topics a,
.top .top_block a {
  color: white;
  text-decoration: none;
}
.top #topics .block,
.top .top_block .block {
  border-bottom: 1px solid white;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  margin-bottom: 3%;
  padding: 3% 0;
  text-align: center;
}
.top #topics .block:last-child,
.top .top_block .block:last-child {
  border-bottom: none;
}
.top #topics .block .block_left,
.top .top_block .block .block_left {
  display: inline-block;
  vertical-align: top;
  width: 15%;
}
.top #topics .block .block_left .box,
.top .top_block .block .block_left .box {
  width: 100%;
  padding-top: 100%;
  border: 1px solid white;
  position: relative;
}
.top #topics .block .block_left .box .box_in,
.top .top_block .block .block_left .box .box_in {
  position: absolute;
  left: 7.5%;
  top: 7.5%;
  width: 85%;
  height: 85%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  font-size: 80%;
}
.top #topics .block .block_left .box .box_in h2,
.top .top_block .block .block_left .box .box_in h2 {
  padding: 0;
  margin: 0;
  font-weight: normal;
}
.top #topics .block .block_left .box .box_in span,
.top .top_block .block .block_left .box .box_in span {
  font-size: 80%;
  line-height: 120%;
  color: #fce807;
}
.top #topics .block .block_right,
.top .top_block .block .block_right {
  display: inline-block;
  vertical-align: top;
  width: 100%;
  margin: auto;
  text-align: left;
  padding-left: 0%;
}
.top #topics .block .block_right p,
.top .top_block .block .block_right p {
  font-size: 85%;
  line-height: 200%;
}
.top #topics .block .block_right p a,
.top .top_block .block .block_right p a {
  text-decoration: underline;
}
.top .top_block {
  margin-bottom: 3%;
}
.top #topics {
  padding: 2% 3%;
  margin-bottom: 3%;
}
.top #topics h2.title {
  padding: 1% 0;
  margin: 0;
  border: none;
  font-family: 'メイリオ', 'Meiryo','Noto Sans JP','ＭＳ ゴシック','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3',sans-serif;
}
.top #topics .block {
  border: none;
  padding: 1% 0;
  margin: auto;
  padding-left: 30px;
  background-image: url("/environment/ourecoact/img/icon/tane.png");
  background-repeat: no-repeat;
  background-size: 25px;
  background-position: 0 30%;
}
.top #topics .block a {
  text-decoration: underline;
}

.page2nd {
  /*
.column h3.title span:before{
  content:"コラム";
}
.news h3.title span:before{
  content:"新着情報";
} */
}
.page2nd .backwhite {
  padding: 3%;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.9);
}
.page2nd .backgray {
  padding: 3%;
  background-color: rgba(90, 90, 90, 0.9);
  color: white;
}
.page2nd .backgray p, .page2nd .backgray a {
  color: white;
}
.page2nd .backgreen {
  padding: 3%;
  background-color: rgba(83, 200, 180, 0.9);
  color: white;
}
.page2nd .backgreen p, .page2nd .backgreen a {
  color: white;
}
.page2nd .backblue {
  padding: 3%;
  background-color: rgba(40, 150, 250, 0.9);
  color: white;
}
.page2nd .backblue p, .page2nd .backblue a {
  color: white;
}
.page2nd .mb3 {
  margin-bottom: 3%;
}
.page2nd .flex {
  display: flex;
}
.page2nd .flex.flex_end {
  align-items: flex-end;
}
.page2nd .flex.between {
  justify-content: space-between;
}
.page2nd .flex.wrap {
  flex-wrap: wrap;
}
.page2nd .flex .w10 {
  width: 10%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w20 {
  width: 20%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w25 {
  width: 25%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w30 {
  width: 30%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w33 {
  width: 31%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w40 {
  width: 40%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w45 {
  width: 45%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w50 {
  width: 50%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w55 {
  width: 55%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w60 {
  width: 60%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w70 {
  width: 70%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex.mb2312 .w70 {
  padding: 0;
}
.page2nd .flex .w80 {
  width: 80%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w90 {
  width: 90%;
  padding: 0 1%;
  display: inline-block;
}
.page2nd .flex .w100 {
  width: 100%;
  padding: 0 1%;
}
.page2nd .flex .image {
  padding: 1%;
  box-sizing: border-box;
	margin: 0 auto;
}
.page2nd .flex .image .image_title {
  font-weight: bold;
  font-size: 120%;
  margin-bottom: 1%;
}
.page2nd .flex .image .image_title span {
  font-size: 70%;
}
.page2nd .flex .image .image_title2 {
  font-weight: bold;
  margin: 8% 0 3%;
}
.page2nd .flex .image .image_title3 {
  font-weight: bold;
  margin: 8% 0 0;
}
.page2nd .flex .image .tips {
  margin-bottom: 5%;
}
.page2nd .flex .image .tips p {
  font-size: 90%;
  padding: 0;
}
.page2nd .flex .image img {
  margin-bottom: 1%;
  width: 100%;
  max-width: 100%;
}
.page2nd .flex .text .name {
  font-size: 120%;
  margin-bottom: 5%;
}
.page2nd #main {
  padding-top: 0;
  padding-bottom: 0;
}
.page2nd #main .backwhite {
  min-height: 85vh;
}
.page2nd #main .backwhite,
.page2nd #main .backwhite.autoh {
  min-height: inherit;
}
.page2nd .category_back {
  margin: auto;
  padding: 0 5% 0 20%;
  animation-duration: 0.5S;
  animation-fill-mode: both;
  animation-delay: 0.1s;
  position: relative;
  max-width: 1500px;
  text-align: center;
}
.page2nd .category_back .backwhite {
  padding-top: 10%;
}
.page2nd .category_back a {
  display: inline-block;
  padding: 1% 5%;
  margin: auto;
  border: 1px solid #0066ff;
  color: #0066ff;
  background: white;
  text-decoration: none;
  position: relative;
  transition: 0.5s;
}
.page2nd .category_back a:hover {
  color: white;
  border-radius: 2px;
  background: #0066ff;
  transition: 0.5s;
}
.page2nd footer {
  max-width: 96%;
  padding: 0 5% 0 20%;
  animation-duration: 0.5S;
  animation-fill-mode: both;
  animation-delay: 0.1s;
  position: relative;
  max-width: 1500px;
  margin: auto;
}
.page2nd footer .backwhite {
  min-height: 15vh;
  padding: 10% 3% 1%;
}
.page2nd .content_block {
  padding: 3% 5%;
}
.page2nd .content_block h2.title {
  border-bottom: 1px solid #333;
  margin-bottom: 3%;
}
.page2nd .content_block h2.title strong,
.page2nd .content_block h2.title span {
  display: block;
  font-weight: normal;
  line-height: 130%;
}
.page2nd .content_block h2.title span {
  color: #339900;
}
.page2nd .content_block h2.title strong {
  font-size: 150%;
  padding: 2% 0;
}
.page2nd .category .list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.page2nd .category .list.space1:after {
  content: "";
  display: block;
  width: 30%;
}
.page2nd .category .list.space2:after {
  content: "";
  display: block;
  width: 30%;
}
.page2nd .category .list.space2:before {
  content: "";
  display: block;
  width: 30%;
  order: 1;
}
.page2nd .category .list .bgblock {
  width: 48%;
  position: relative;
  padding-top: 48%;
  margin-bottom: 3%;
  overflow: hidden;
}
.page2nd .category .list .bgblock:hover {
  background: none;
}
.page2nd .category .list .bgblock.space1:after {
  content: "";
  display: block;
  width: 30%;
}
.page2nd .category .list .bgblock.space2:after {
  content: "";
  display: block;
  width: 30%;
}
.page2nd .category .list .bgblock.space2:before {
  content: "";
  display: block;
  width: 30%;
  order: 1;
}
.page2nd .category .list .bgblock a {
  position: absolute;
  left: 0;
  top: 0;
  background-color: #ccc;
  width: 100%;
  height: 100%;
  background-image: url("/environment/ourecoact/img/box/sec01_01.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.page2nd .category .list .bgblock a:hover:before {
  opacity: 0;
  transition-duration: 1s;
}
.page2nd .category .list .bgblock a h3 {
  background: rgba(65, 105, 225, 0.6);
  position: absolute;
  left: 0;
  bottom: 0;
  font-size: 100%;
  font-weight: normal;
  text-decoration: none;
  text-align: left;
  padding: 4%;
  width: 100%;
  color: white;
  text-shadow: 1px 1px 2px black;
  z-index: 10;
}
.page2nd .category .list .bgblock a:before {
  content: "";
  width: 100%;
  height: 100%;
  z-index: 2;
  top: 0;
  left: 0;
  position: absolute;
  transition-duration: 1s;
  background: rgba(65, 105, 225, 0.3);
}
.page2nd .category .list .bgblock a:after {
  content: "";
  width: 10%;
  padding-top: 10%;
  background-image: url("/environment/ourecoact/img/icon/arrow.png");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 25% auto;
  border-radius: 50%;
  position: absolute;
  top: 3%;
  right: 3%;
  background-color: rgba(65, 105, 225, 0.4);
  z-index: 2;
}
.page2nd .category .list .bgblock a.bg01_02 {
  background-image: url("/environment/ourecoact/img/box/sec01_02.jpg");
}
.page2nd .category .list .bgblock a.bg01_03 {
  background-image: url("/environment/ourecoact/img/box/sec01_03.jpg");
}
.page2nd .category .list .bgblock a.bg02_01 {
  background-image: url("/environment/ourecoact/img/box/sec02_01.jpg");
}
.page2nd .category .list .bgblock a.bg02_02 {
  background-image: url("/environment/ourecoact/img/box/sec02_02.jpg");
}
.page2nd .category .list .bgblock a.bg02_03 {
  background-image: url("/environment/ourecoact/img/box/sec02_03.jpg");
}
.page2nd .category .list .bgblock a.bg02_04 {
  background-image: url("/environment/ourecoact/img/box/sec02_04.jpg");
}
.page2nd .category .list .bgblock a.bg02_05 {
  background-image: url("/environment/ourecoact/img/box/sec02_05.jpg");
}
.page2nd .category .list .bgblock a.bg02_06 {
  background-image: url("/environment/ourecoact/img/box/sec02_06.jpg");
}
.page2nd .category .list .bgblock a.bg02_07 {
  background-image: url("/environment/ourecoact/img/box/sec02_07.jpg");
}
.page2nd .category .list .bgblock a.bg02_08 {
  background-image: url("/environment/ourecoact/img/box/sec02_08.jpg");
}
.page2nd .category .list .bgblock a.bg02_09 {
  background-image: url("/environment/ourecoact/img/box/sec02_09.jpg");
}
.page2nd .category .list .bgblock a.bg02_10 {
  background-image: url("/environment/ourecoact/img/box/sec02_10.jpg");
}
.page2nd .category .list .bgblock a.bg02_11 {
  background-image: url("/environment/ourecoact/img/box/sec02_11.jpg");
}
.page2nd .category .list .bgblock a.bg03_01 {
  background-image: url("/environment/ourecoact/img/box/sec03_01.jpg");
}
.page2nd .category .list .bgblock a.bg03_02 {
  background-image: url("/environment/ourecoact/img/box/sec03_02.jpg");
}
.page2nd .category .list .bgblock a.bg03_03 {
  background-image: url("/environment/ourecoact/img/box/sec03_03.jpg");
}
.page2nd .category .list .bgblock a.bg03_04 {
  background-image: url("/environment/ourecoact/img/box/sec03_04.jpg");
}
.page2nd .category .list .bgblock a.bg04_01 {
  background-image: url("/environment/ourecoact/img/box/sec04_01.jpg");
}
.page2nd .category .list .bgblock a.bg04_02 {
  background-image: url("/environment/ourecoact/img/box/sec04_02.jpg");
}
.page2nd .category .list .bgblock a.bg04_03 {
  background-image: url("/environment/ourecoact/img/box/sec04_03.jpg");
}
.page2nd .category .list .bgblock a.bg04_04 {
  background-image: url("/environment/ourecoact/img/box/sec04_04.jpg");
}
.page2nd .category .list .bgblock a.bg04_05 {
  background-image: url("/environment/ourecoact/img/box/sec04_05.jpg");
}
.page2nd .category .list .bgblock a.bg04_06 {
  background-image: url("/environment/ourecoact/img/box/sec04_06.jpg");
}
.page2nd .category .list .bgblock a.bg05_01 {
  background-image: url("/environment/ourecoact/img/box/sec05_01.jpg");
}
.page2nd .category .list .bgblock a.bg05_02 {
  background-image: url("/environment/ourecoact/img/box/sec05_02.jpg");
}
.page2nd .category .list .bgblock a.bg05_03 {
  background-image: url("/environment/ourecoact/img/box/sec05_03.jpg");
}
.page2nd .category .list .bgblock a.bg05_04 {
  background-image: url("/environment/ourecoact/img/box/sec05_04.jpg");
}
.page2nd .category .list .bgblock a.bg06_01 {
  background-image: url("/environment/ourecoact/img/box/sec06_01.jpg");
}
.page2nd .category .list .bgblock a.bg06_02 {
  background-image: url("/environment/ourecoact/img/box/sec06_02.jpg");
}
.page2nd .category .list .bgblock a.bg06_03 {
  background-image: url("/environment/ourecoact/img/box/sec06_03.jpg");
}
.page2nd .category .list .bgblock a.bg_topic01 {
  background-image: url("/environment/ourecoact/img/box/topic_01.jpg");
}
.page2nd .category .list .bgblock a.bg_topic02 {
  background-image: url("/environment/ourecoact/img/box/topic_02.jpg");
}
.page2nd .category .list .bgblock a.bg_topic03 {
  background-image: url("/environment/ourecoact/img/box/topic_03.jpg");
}
.page2nd .category .list .bgblock a.bg_topic04 {
  background-image: url("/environment/ourecoact/img/box/topic_04.jpg");
}
.page2nd .read {
  font-size: 110%;
  line-height: 130%;
  margin-bottom: 5%;
  letter-spacing: 0.1rem;
}
.page2nd .page a:visited, .page2nd .page a:link {
  color: #2A59EE;
  text-decoration: underline;
}
.page2nd .page .subtitle {
  font-weight: normal;
  margin-bottom: 3%;
  font-size: 130%;
  letter-spacing: 2px;
}
.page2nd .page .subtitle2 {
  font-weight: normal;
  margin-bottom: 3%;
  font-size: 125%;
  position: relative;
  padding: 1% 0;
  letter-spacing: 2px;
}
.page2nd .page .subtitle2:after {
  position: absolute;
  bottom: 0;
  content: "";
  height: 2px;
  width: 100%;
  left: 0;
  background: -webkit-repeating-linear-gradient(-45deg, #4682b4, #4682b4 3px, rgba(0, 0, 0, 0) 3px, rgba(0, 0, 0, 0) 6px);
  background: repeating-linear-gradient(-45deg, #4682b4, #4682b4 3px, rgba(0, 0, 0, 0) 3px, rgba(0, 0, 0, 0) 6px);
}
.page2nd .page .block {
  margin-bottom: 5%;
  /* 210819 start */
  /* 210819 end */
}
.page2nd .page .block .block {
  margin-bottom: 3%;
}
.page2nd .page .block .text {
  line-height: 140%;
  margin-bottom: 3%;
}
.page2nd .page .block h3.ttl_data {
  margin-top: 2rem;
  font-size: 96%;
  font-weight: bold;
}
.page2nd .page .block h3.ttl_data:before {
  content: "■ ";
}
.page2nd .page .block ul {
  padding-left: 0;
}
.page2nd .page .block ul li {
  list-style-type: none;
}
.page2nd .page .block ol {
  padding-left: 0;
}
.page2nd .page .block ol li {
  list-style-type: none;
}
.page2nd .page .block dt {
  font-weight: bold;
}
.page2nd .page .block .table {
  line-height: normal;
}
.page2nd .page .block .table table {
  width: 100%;
  font-size: 90%;
}
.page2nd .page .block .table table .noborder_noback {
  background-color: rgba(255, 255, 255, 0) !important;
  border: none !important;
}
.page2nd .page .block .table table th, .page2nd .page .block .table table td {
  border-right: 1px dotted #ccc;
  border-top: 1px solid #ccc;
  padding: .5% 1%;
  vertical-align: top;
}
.page2nd .page .block .table table th:last-child, .page2nd .page .block .table table td:last-child {
  border-right: none;
}
.page2nd .page .block .table table thead tr:last-child th, .page2nd .page .block .table table thead tr:last-child td {
  border-bottom: none;
}
.page2nd .page .block .table table tr:last-child th, .page2nd .page .block .table table tr:last-child td {
  border-bottom: 1px solid #ccc;
}
.page2nd .page .block .table table.strip tbody tr:nth-of-type(even) {
  background: rgba(253, 218, 109, 0.1);
}
.page2nd .page .block .table table.yellow thead th {
  background: #fdda6d;
  color: white;
  text-shadow: 1px 1px 2px #444;
}
.page2nd .page .block .table table.green thead th {
  background: #70ad47;
  color: white;
  text-shadow: 1px 1px 2px #444;
}
.page2nd .page .block .table table.green.strip tbody tr:nth-of-type(even) {
  background: rgba(226, 240, 217, 0.8);
}
.page2nd .page .block .tips {
  margin-bottom: 5%;
}
.page2nd .page .block .tips h4 {
  font-weight: normal;
}
.page2nd .page .block .tips p {
  font-size: 90%;
  padding: 1% 1% 1% 3%;
}
.page2nd .page .block p.tips {
  font-weight: normal;
  font-size: 80%;
}
.page2nd .page .block table.dataTbl {
  width: 98%;
  border-collapse: collapse;
  margin: 0 auto 20px;
}
.page2nd .page .block table.dataTbl th {
  background: #eee;
  font-size: 86%;
  text-align: left;
  border: 1px solid #aaa;
  padding: 1rem;
}
.page2nd .page .block table.dataTbl th.dataTbl_ttl {
  font-size: 96%;
  text-align: center;
}
.page2nd .page .block table.dataTbl td {
  background: #fff;
  font-size: 86%;
  text-align: center;
  border: 1px solid #aaa;
  padding: 1rem;
}
.page2nd .page .block table.dataTbl td a[href$=".pdf"]:after {
  content: " <PDF> ";
  display: inline-block;
}
.page2nd .page .block .flex .text h3.kary {
  width: 90%;
  background: rgba(255, 255, 255, 0.8);
  color: #000;
  margin: 0.5rem auto 0;
  padding: 0.3rem 0 0;
  text-align: center;
  font-size: 120%;
  line-height: 160%;
}
.page2nd .page .block .flex .text ul.kary li {
  list-style-type: disc;
  margin: 0 0 0 3rem;
}
.page2nd .page .block .kansou {
  position: relative;
  background: url(/environment/ourecoact/img/education/environmental-education/no_text.png) no-repeat;
  background-position: 0 0;
  background-size: contain;
  padding-bottom: 60%;
}
.page2nd .page .block .kansou .kansou_block {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  padding: 8% 10%;
}
.page2nd .page .block .kansou .kansou_block h4 {
  color: #B8565F;
  font-size: 150%;
  font-weight: bold;
  margin-bottom: 5%;
}
.page2nd .page .block .kansou .kansou_block ul li {
  padding-bottom: 1%;
  font-weight: bold;
  font-size: 86%;
  line-height: 140%;
}
.page2nd .page .block .kansou .kansou_block ul li strong {
  color: #B8565F;
}
.page2nd .link_block.press a:before,
.page2nd .link_block.kessan a:before {
  content: "Press release ";
  display: inline-block;
  color: #da0101;
}
.page2nd .link_block.kessan a:before {
  content: "Link　";
}
.page2nd .link_block.news a:before {
  content: "お知らせ ";
  display: inline-block;
  color: #da0101;
}
.page2nd .link_block a {
  display: block;
  border: 1px solid #ccc;
  padding: 1.2% 3%;
  margin-bottom: 2%;
  text-decoration: none;
  color: #333;
  padding-left: 5%;
  font-size: 90%;
  background-image: url("/environment/ourecoact/img/icon/yajirushi.png");
  background-repeat: no-repeat;
  background-position: 1% 50%;
  transition-duration: 1s;
}
.page2nd .link_block a:hover {
  transition-duration: 1s;
  color: white;
  background-color: rgba(65, 105, 225, 0.5);
}
.page2nd .link_block a[href$=".pdf"]:after {
  content: " <PDF> ";
  display: inline-block;
}
.page2nd .topics,
.page2nd .column,
.page2nd .news {
  padding: 2%;
}
.page2nd .topics h3.title,
.page2nd .column h3.title,
.page2nd .news h3.title {
  text-align: center;
  font-size: 180%;
  font-family: 'M PLUS Rounded 1c', sans-serif;
  line-height: 200%;
  padding: 1% 0 3%;
}
.page2nd .topics h3.title strong,
.page2nd .column h3.title strong,
.page2nd .news h3.title strong {
  display: block;
  font-weight: normal;
  font-size: 65%;
  line-height: 110%;
  display: block;
  border-top: 1px solid white;
  padding: 2% 0;
}
.page2nd .topics .block,
.page2nd .column .block,
.page2nd .news .block {
  padding: 3% 0 5%;
}
.page2nd .topics .block.mb2312,
.page2nd .news .block.mb2312 {
  padding: 0 0 10px;
}
.page2nd .topics .block .text p,
.page2nd .column .block .text p,
.page2nd .news .block .text p {
  line-height: 200%;
}
.page2nd .topics .block .link,
.page2nd .column .block .link,
.page2nd .news .block .link {
  padding: 2% 0;
}
.page2nd .topics .link_block a,
.page2nd .column .link_block a,
.page2nd .news .link_block a {
  color: white;
}
.page2nd .news h4.title {
  font-weight: bold;
  margin-bottom: 2%;
}
.page2nd .news .text.waku {
  border: 1px solid #fff;
  padding: 1.8rem 2em 0.4rem;
}
.page2nd .news table.edu_tbl th {
  font-weight: normal;
  white-space: nowrap;
  vertical-align: top;
  padding: 0 .6rem 1rem 0;
}
.page2nd .news table.edu_tbl td {
  padding-bottom: 1rem;
}
.page2nd .books {
  padding: 2% 0;
  text-align: center;
  box-sizing: border-box;
}
.page2nd .books .book {
  text-align: left;
  display: inline-block;
  width: 48%;
  box-sizing: border-box;
  padding: 0 2% 5%;
}
.page2nd .books .book a.flex {
  position: relative;
  flex-wrap: wrap;
  text-decoration: none;
  margin-bottom: 1%;
  padding: 4%;
}
.page2nd .books .book a.flex:hover {
  opacity: .9;
}
.page2nd .books .book a.flex:hover .circle_catch {
  top: 18%;
  transition: .3s;
}
.page2nd .books .book a.flex h4 {
  font-weight: bold;
  color: #f39600;
  padding: 1% 0;
  width: 100%;
}
.page2nd .books .book a.flex .bookimage {
  width: 50%;
}
.page2nd .books .book a.flex .circle_catch {
  transition: .3s;
  position: absolute;
  right: 5%;
  top: 20%;
  width: 20%;
  padding: 20%;
  border-radius: 50%;
  background: #f39600;
  color: white;
  background-color: #f39600;
  font-weight: 900;
}
.page2nd .books .book a.flex .circle_catch:after {
  content: "";
  border-top: 10px solid transparent;
  border-right: 20px solid #f39600;
  border-bottom: 10px solid transparent;
  position: absolute;
  width: 10px;
  height: 10px;
  left: -10px;
  top: 55%;
  transform: rotate(-10deg);
}
.page2nd .books .book a.flex .circle_catch h5 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  width: 100%;
  text-align: center;
}
.page2nd .books .book a.flex .circle_catch h5 span {
  font-size: 60%;
}
.page2nd .books .book a.flex .data {
  position: absolute;
  right: 5%;
  top: 72%;
  width: 40%;
}
.page2nd .books .book a.flex .data span {
  display: block;
  font-size: 70%;
}
.page2nd .books .book.book2 a.flex .circle_catch {
  background: #22ab37;
}
.page2nd .books .book.book2 a.flex .circle_catch:after {
  border-right: 20px solid #22ab37;
}
.page2nd .books .book.book2 a.flex h4 {
  color: #22ab37;
}
.page2nd .books .book.book3 a.flex .circle_catch {
  background: #00a0e9;
}
.page2nd .books .book.book3 a.flex .circle_catch:after {
  border-right: 20px solid #00a0e9;
}
.page2nd .books .book.book3 a.flex h4 {
  color: #00a0e9;
}
.page2nd .books .book.book4 a.flex .circle_catch {
  background: #920784;
}
.page2nd .books .book.book4 a.flex .circle_catch:after {
  border-right: 20px solid #920784;
}
.page2nd .books .book.book4 a.flex h4 {
  color: #920784;
}
.page2nd .books .book.book5 a.flex .circle_catch {
  background: #e8072b;
}
.page2nd .books .book.book5 a.flex .circle_catch:after {
  border-right: 20px solid #e8072b;
}
.page2nd .books .book.book5 a.flex h4 {
  color: #e8072b;
}
.page2nd .books .book.book6 a.flex .circle_catch {
  background: #dba865;
}
.page2nd .books .book.book6 a.flex .circle_catch:after {
  border-right: 20px solid #dba865;
}
.page2nd .books .book.book6 a.flex h4 {
  color: #dba865;
}
.page2nd #environmental-policy .shisin > li {
  margin-bottom: 5%;
}
.page2nd #environmental-policy .shisin > li > h5 {
  font-size: 115%;
  margin-bottom: 1%;
  padding-left: 1.5rem;
}
.page2nd #environmental-policy .shisin > li > ol.big > li {
  padding-left: 3.5rem;
}
.page2nd #environmental-policy .list2 > li, .page2nd #environmental-policy .shisin li ol li > li {
  margin: 0 0 5px 1rem;
  text-indent: 0;
  list-style-type: disc;
}
.page2nd .environmental_photos > div.image {
  width: 48%;
  padding: 1%;
  display: inline-block;
}
.page2nd .topic_images .image {
  position: relative;
}
.page2nd .topic_images .image .name {
  position: absolute;
  display: block;
  bottom: 10%;
  left: 0;
  width: 100%;
  text-align: center;
}
.page2nd .topic_images .image .name b {
  color: #333;
  background: white;
  border: 2px solid rgba(40, 150, 250, 0.9);
  text-align: center;
  padding: 2% 10%;
  margin: 2%;
  font-size: 80%;
  display: inline-block;
  border-radius: 5px;
}

/*CSSスライドショー設定
---------------------------------------------------------------------------*/
@keyframes slide1 {
  0% {
    opacity: 1;
    transform: scale(1);
  }
  10% {
    opacity: 1;
  }
  30% {
    opacity: 1;
  }
  40% {
    opacity: 0;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
@keyframes slide2 {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  30% {
    opacity: 0;
  }
  40% {
    opacity: 1;
  }
  60% {
    opacity: 1;
  }
  70% {
    opacity: 0;
  }
  100% {
    opacity: 0;
    transform: scale(1);
  }
}
@keyframes slide3 {
  0% {
    opacity: 0;
    transform: scale(1);
  }
  60% {
    opacity: 0;
  }
  70% {
    opacity: 1;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
/*mainimg
---------------------------------------------------------------------------*/
/*画像ブロック*/
#mainimg {
  overflow: hidden;
  clear: left;
  text-indent: -9999px;
  position: fixed;
  top: 0px;
  width: 100%;
  height: 100%;
  z-index: -1;
}

/*３枚画像の共通設定*/
.slide1, .slide2, .slide3, .slide4, .slide5 {
  animation-timing-function: linear;
  animation-duration: 30s;
  /*実行する時間。「s」は秒の事。*/
  animation-iteration-count: infinite;
  /*実行する回数。「infinite」は無限に繰り返す意味。*/
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  animation-fill-mode: both;
  background-size: cover;
  background-position: center;
}

/*１枚目*/
.slide1 {
  animation-name: slide1;
  /*上で設定しているキーフレーム（keyframes）の名前*/
}

/*２枚目*/
.slide2 {
  animation-name: slide2;
  /*上で設定しているキーフレーム（keyframes）の名前*/
}

/*３枚目*/
.slide3 {
  animation-name: slide3;
  /*上で設定しているキーフレーム（keyframes）の名前*/
}

/*４枚目*/
/*５枚目*/
.r_and_a .request {
  display: flex;
  justify-content: space-around;
  align-items: flex-start;
  margin-bottom: 3%;
}
.r_and_a .request:before {
  content: "";
  width: 100px;
  height: 100px;
  background: url("/environment/ourecoact/img/icon/girl.png") no-repeat;
  background-size: cover;
  display: inline-block;
}
.r_and_a .request.woman:before {
  background-image: url("/environment/ourecoact/img/icon/woman.png");
}
.r_and_a .request.boy:before {
  background-image: url("/environment/ourecoact/img/icon/boy.png");
}
.r_and_a .request .text {
  background: #ec93c1;
  border: 1px solid #ec93c1;
  padding: 2% 5%;
  border-radius: 10px;
  position: relative;
  z-index: 2;
  color: white;
  width: calc(100% - 200px);
  display: inline-block;
}
.r_and_a .request .text p:before {
  content: "●";
}
.r_and_a .request .text:after {
  content: "";
  position: absolute;
  top: 10px;
  left: -50px;
  margin-top: 0;
  border: 18px solid transparent;
  border-right: 50px solid #ec93c1;
  z-index: 0;
}
.r_and_a .answer {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-around;
  align-items: flex-start;
  margin-bottom: 8%;
}
.r_and_a .answer:before {
  content: "";
  width: 100px;
  height: 100px;
  background: url("/environment/ourecoact/img/icon/answer.png") no-repeat;
  background-size: cover;
  display: inline-block;
}
.r_and_a .answer .text {
  background: #a2d1b5;
  border: 1px solid #a2d1b5;
  padding: 2% 5%;
  border-radius: 10px;
  position: relative;
  z-index: 2;
  color: white;
  width: calc(100% - 200px);
  display: inline-block;
}
.r_and_a .answer .text:after {
  content: "";
  position: absolute;
  top: 10px;
  right: -50px;
  margin-top: 0;
  border: 18px solid transparent;
  border-left: 50px solid #a2d1b5;
  z-index: 0;
}

/* 20231215 start */
.page2nd .page .block table.compla_tbl {
  width: 100%;
  font-size: 80%;
  border-collapse: collapse;
  margin: 0 auto 20px;
}
.page2nd .page .block table.compla_tbl th {
  font-size: 90%;
  padding: .2rem .6rem;
}
.page2nd .page .block table.compla_tbl td.tips {
  font-size: 80%;
  text-align: right;
  border: none;
  padding: .2rem .6rem;
}
.page2nd .page .block table.compla_tbl th.ttl_top {
  background: #c0dd98;
  border-left: 2px solid #fff;
}
.page2nd .page .block table.compla_tbl th.ttl_top:first-child {
  border-left: none;
}
.page2nd .page .block table.compla_tbl th.ttl_side {
  text-align: left;
  border-right: 2px solid #14af4b;
  border-bottom: 2px solid #14af4b;
}
.page2nd .page .block table.compla_tbl td {
  text-align: center;
  border: 2px solid #14af4b;
  border-top: none;
  padding: .4rem .6rem;
}
.page2nd .page .block table.compla_tbl td:first-child {
  border-left: none;
}
.page2nd .page .block table.compla_tbl td:last-child {
  border-right: none;
}
/* 20231215 end */

@media screen and (max-width: 1515px) {
  .page2nd footer,
  .page2nd .category_back,
  #main {
    max-width: 96%;
  }
}
@media screen and (max-width: 1024px) {
  .sp_center {
    text-align: center;
  }

  .sp_right {
    text-align: right;
  }

  .pc {
    display: none;
  }

  .sp {
    display: block;
  }
  .sp.il {
    display: inline;
  }
  .sp.ilb {
    display: inline-block;
  }

  html body {
    font-size: 4vw;
  }
  html .indent {
    text-indent: 4.2vw;
    letter-spacing: .1vw;
  }
  html .rev_indent {
    text-indent: -4.2vw;
    padding-left: 4.2vw;
  }
  html .rev_indent.rev2 {
    text-indent: -7.5vw;
    padding-left: 7.5vw;
  }
  html .rev_indent.rev3 {
    text-indent: -10vw;
    padding-left: 10vw;
  }
  html ul.marklist, html ol.marklist {
    list-style: none;
    text-indent: -4.2vw;
    padding-left: 4.2vw;
  }
  html ul.marklist.big, html ol.marklist.big {
    text-indent: -7.5vw;
    padding-left: 7.5vw;
  }

  header {
    width: 100%;
    height: auto;
    background-color: #4169e1;
    background-color: rgba(65, 105, 225, 0.7);
    top: 0;
    left: 0;
  }
  header h1.logo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }
  header h1.logo a {
    width: 80%;
    padding: 5%;
  }
  header h1.logo a img.logo {
    width: 100%;
  }
  header h1.logo .sp_btn {
    width: 15%;
    padding-right: 5%;
    display: block;
  }
  header h1.logo .sp_btn .close_btn {
    display: none;
  }
  header .icon,
  header #menubar,
  header .nav_okiden_link {
    display: none;
  }
  header.on, header:hover {
    width: 100%;
  }
  header.on {
    height: 100vh;
  }
  header.on h1.logo .sp_btn .close_btn {
    display: block;
  }
  header.on h1.logo .sp_btn .view_btn {
    display: none;
  }
  header.on .icon,
  header.on nav#menubar {
    display: block;
  }
  header.on nav#menubar ul li.menuimg {
    background-repeat: no-repeat;
    background-size: 10vw;
    background-position: 5% 50%;
  }
  header.on nav#menubar ul li a {
    height: auto;
    padding: 5%;
  }
  header.on nav#menubar ul li a span {
    font-size: 120%;
    padding-left: 20%;
  }
  header.on .nav_okiden_link {
    display: block;
  }
  header.on .icon {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
  }
  header.on .icon li {
    width: 15%;
    display: inline-block;
  }
  header.on .icon li img {
    display: block;
    width: auto;
  }

  .page2nd .category_back {
    padding: 0 2%;
  }

  .page2nd .topics .block .text p,
  .page2nd .column .block .text p,
  .page2nd .news .block .text p {
    font-size: 100%;
  }

  .page2nd .books .book {
    width: 98%;
    margin-bottom: 10%;
  }
  .page2nd .books .book .flex {
    flex-direction: column;
  }
  .page2nd .books .book .flex h4 {
    font-size: 120%;
  }
  .page2nd .books .book .flex .bookimage {
    width: 50% !important;
  }
  .page2nd .books .book .flex .data {
    width: 40% !important;
  }
  .page2nd .books .book .flex .circle_catch {
    width: 20% !important;
  }

  #main {
    padding: 2%;
  }

  #mainimg {
    position: fixed;
  }
  #mainimg .slide1, #mainimg .slide2, #mainimg .slide3 {
    background-size: cover;
  }

  .slide1 {
    background-position: 57% 0;
  }

  footer {
    max-width: 92%;
    margin: auto;
    padding: 3% 1%;
    text-align: center;
    font-size: 90%;
  }

  .top .toplogo {
    width: 100%;
    height: 50vh;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 5vh auto 30vh;
    padding-bottom: 10vh;
  }
  .top .toplogo img {
    width: 60%;
    margin-top: 5vh;
  }
  .top .top_block {
    margin-bottom: 15%;
  }
  .top .top_block h2.title {
    border-bottom: 1px solid white;
  }
  .top .top_block .block {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
  }
  .top .top_block .block .block_left {
    width: 30%;
    margin: 3%;
  }
  .top .top_block .block .block_left .box .box_in span {
    font-size: 60%;
  }
  .top .top_block .block .block_right {
    width: 100%;
    padding-left: 0;
  }
  .top .top_block .block .block_right p {
    font-size: 100%;
  }
  .top .top_block {
    margin-bottom: 3%;
  }
  .top #topics {
    padding: 3%;
  }
  .top #topics .block {
    background-size: 3vw;
    background-position: 0 1vw;
    margin-bottom: 7%;
  }

  .page2nd #main {
    margin-top: 14vh;
    /* 210819 start */
    /* 210819 end */
  }
  .page2nd #main .backwhite {
    min-height: 82vh;
  }
  .page2nd #main .backwhite.autoh {
    min-height: inherit;
  }
  .page2nd #main .page .block table.dataTbl {
    width: 100%;
  }
  .page2nd #main .page .block table.dataTbl td {
    white-space: nowrap;
    line-height: 3;
  }
  .page2nd footer {
    max-width: 96%;
    margin: auto;
    padding: 0% 2%;
  }
  .page2nd .content_block {
    padding: 0;
  }
  .page2nd .content_block h2.title {
    padding: 3%;
  }
  .page2nd .content_block h2.title span {
    font-size: 80%;
  }
  .page2nd .content_block h2.title strong {
    line-height: 130%;
    font-size: 100%;
  }
  .page2nd .category .list {
    padding: 5%;
    flex-direction: column;
  }
  .page2nd .category .list .bgblock {
    width: 100%;
    padding-top: 100%;
    margin-bottom: 5%;
  }
  .page2nd .category .list .bgblock a:before {
    display: none;
  }
  .page2nd .category .list .bgblock a h3 {
    padding: 5%;
    line-height: 150%;
  }
  .page2nd .page .block, .page2nd .topics .block, .page2nd .column .block, .page2nd .news .block {
    padding: 3%;
  }
  .page2nd .page .block .block, .page2nd .topics .block .block, .page2nd .column .block .block, .page2nd .news .block .block {
    padding: 0 0 1%;
  }
  .page2nd .page .block .table, .page2nd .topics .block .table, .page2nd .column .block .table, .page2nd .news .block .table {
    overflow: auto;
    /*スクロールさせる*/
    white-space: nowrap;
    /*文字の折り返しを禁止*/
  }
  .page2nd .page .block .table table, .page2nd .topics .block .table table, .page2nd .column .block .table table, .page2nd .news .block .table table {
    width: 200%;
  }
  .page2nd .page .block .kansou, .page2nd .topics .block .kansou, .page2nd .column .block .kansou, .page2nd .news .block .kansou {
    position: relative;
    background: #f3ebcf;
    padding: 5%;
  }
  .page2nd .page .block .kansou .kansou_block, .page2nd .topics .block .kansou .kansou_block, .page2nd .column .block .kansou .kansou_block, .page2nd .news .block .kansou .kansou_block {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    padding: 5% 0;
  }
  .page2nd .page .block .kansou .kansou_block h4, .page2nd .topics .block .kansou .kansou_block h4, .page2nd .column .block .kansou .kansou_block h4, .page2nd .news .block .kansou .kansou_block h4 {
    color: #B8565F;
    border-bottom: 1px solid #444;
    padding-bottom: 2%;
    margin: 0;
  }
  .page2nd .page .block .kansou .kansou_block ul, .page2nd .topics .block .kansou .kansou_block ul, .page2nd .column .block .kansou .kansou_block ul, .page2nd .news .block .kansou .kansou_block ul {
    padding: 3vw 0 0;
    padding-left: 5vw;
  }
  .page2nd .page .block .kansou .kansou_block ul li, .page2nd .topics .block .kansou .kansou_block ul li, .page2nd .column .block .kansou .kansou_block ul li, .page2nd .news .block .kansou .kansou_block ul li {
    padding-bottom: 1%;
    font-weight: bold;
    font-size: 86%;
    line-height: 140%;
  }
  .page2nd .page .block .kansou .kansou_block ul li strong, .page2nd .topics .block .kansou .kansou_block ul li strong, .page2nd .column .block .kansou .kansou_block ul li strong, .page2nd .news .block .kansou .kansou_block ul li strong {
    color: #B8565F;
  }
  .page2nd .page .read, .page2nd .topics .read, .page2nd .column .read, .page2nd .news .read {
    padding: 3%;
    line-height: 160%;
  }
  .page2nd .page p,
  .page2nd .page .subtitle, .page2nd .topics p,
  .page2nd .topics .subtitle, .page2nd .column p,
  .page2nd .column .subtitle, .page2nd .news p,
  .page2nd .news .subtitle {
    line-height: 150%;
  }
  .page2nd .page .flex, .page2nd .topics .flex, .page2nd .column .flex, .page2nd .news .flex {
    flex-direction: column;
  }
  .page2nd .page .flex:not(.sp_keep), .page2nd .topics .flex:not(.sp_keep), .page2nd .column .flex:not(.sp_keep), .page2nd .news .flex:not(.sp_keep) {
    flex-wrap: nowrap !important;
  }
  .page2nd .page .flex:not(.sp_keep) > div, .page2nd .topics .flex:not(.sp_keep) > div, .page2nd .column .flex:not(.sp_keep) > div, .page2nd .news .flex:not(.sp_keep) > div {
    width: 100%  !important;
  }
  .page2nd .page .environmental_photos > div.image, .page2nd .topics .environmental_photos > div.image, .page2nd .column .environmental_photos > div.image, .page2nd .news .environmental_photos > div.image {
    width: 100%;
    padding: 0 0 5%;
  }
  .page2nd .link_block.press a:before,
  .page2nd .link_block.kessan a:before {
    display: block;
  }
  .page2nd .link_block a {
    padding: 3% 10%;
    background-position: 1vw 2vw;
    transition-duration: 1s;
    background-size: 5vw auto;
  }
  .page2nd .topics h3.title span,
  .page2nd .column h3.title span {
    padding: 3%;
  }
  .page2nd .topics h3.title strong,
  .page2nd .column h3.title strong {
    padding: 5% 0 0;
  }
  .page2nd .topics .block,
  .page2nd .column .block {
    padding: 3%;
  }

  .r_and_a .request,
  .r_and_a .answer {
    flex-direction: column-reverse;
  }
  .r_and_a .request .text,
  .r_and_a .answer .text {
    width: 100%;
  }
  .r_and_a .request {
    margin-bottom: 5%;
  }
  .r_and_a .request:before {
    width: 100%;
    background-size: contain;
    display: inline-block;
    background-position: center;
  }
  .r_and_a .request .text:after {
    content: "";
    position: absolute;
    top: inherit;
    bottom: -6vw;
    left: calc(50% - 2.5vw);
    border: 3vw solid transparent;
    border-top: 4vw solid #ec93c1;
    z-index: 0;
    top: inherit;
  }
  .r_and_a .answer {
    margin-bottom: 15%;
  }
  .r_and_a .answer:before {
    width: 100%;
    background-size: contain;
    display: inline-block;
    background-position: center;
  }
  .r_and_a .answer .text:after {
    content: "";
    position: absolute;
    top: inherit;
    bottom: -6vw;
    right: inherit;
    left: calc(50% - 2.5vw);
    border: 3vw solid transparent;
    border-top: 4vw solid #a2d1b5;
    z-index: 0;
    top: inherit;
  }
}
html.lb-disable-scrolling {
  position: static !important;
}

@media print {
  #mainimg,
  .nav-fix-pos-pagetop,
  .category_back,
  header {
    display: none;
  }

  #main {
    padding: 0;
    max-width: 100%;
  }

  .page2nd #main .backblue,
  .page2nd #main .backwhite,
  .page2nd #main .backgray {
    min-height: inherit;
  }

  footer {
    text-shadow: none;
    color: #333;
  }
}


/* 20230822 */
.page2nd .page .block .table_area {
	background: #fff;
	overflow: auto;
	margin-bottom: 10px;
	padding: 10px;
}
	@media screen and (max-width: 1025px){
		.table_area {
			overflow-x: scroll;
		}
	}
.page2nd .page .block table.policy_table th {
	background: #aaa;
	color: #fff;
	font-weight: normal;
	font-size: 80%;
	white-space: nowrap;
	padding: .4rem .8rem .2rem;
}
	.page2nd .page .block table.policy_table th.num {
		padding: .4rem .4rem .2rem;
	}
	.page2nd .page .block table.policy_table tr.p01 th {
		background: #81b14d;
	}
	.page2nd .page .block table.policy_table tr.p02 th {
		background: #128ec1;
	}
	.page2nd .page .block table.policy_table tr.p03 th {
		background: #c84114;
	}
	.page2nd .page .block table.policy_table tr.p04 th {
		background: #a13c80;
	}
.page2nd .page .block table.policy_table td {
	font-size: 80%;
	text-align: left;
	padding: .6rem .8rem .4rem;
}
	.page2nd .page .block table.policy_table td.num {
		text-align: center;
		padding: .4rem .4rem .2rem;
	}
	.page2nd .page .block table.policy_table td.sub_ttl {
		white-space: nowrap;
	}
	.page2nd .page .block table.policy_table tr.p01 td {
		background: #e8f1dc;
	}
	.page2nd .page .block table.policy_table tr.p02 td {
		background: #dee8f2;
	}
	.page2nd .page .block table.policy_table tr.p03 td {
		background: #f5e1e2;
	}
	.page2nd .page .block table.policy_table tr.p04 td {
		background: #f4e7f1;
	}
.page2nd .page .block .policy_note,
.page2nd .block .text .note {
	font-size: 80%;
}
.page2nd .block .text .note2 {
	font-size: 90%;
}
.page2nd .block.backwhite.logo {
	color: #000;
	margin-bottom: 30px;
	padding: 3rem 2rem 1rem;
}
.page2nd .block.backwhite.logo .text p {
	color: #000;
	font-size: 96%;
	line-height: 1.4;
	letter-spacing: normal;
}
.page2nd .block.backwhite.logo .flex .image {
	text-align: center;
}
.page2nd .block.backwhite.logo .flex .image img {
	width: auto;
	height: 150px;
	color: #000;
}
.page2nd .block .text .newslist {
	list-style-type: none;
	padding-left: 1rem;
}
.page2nd .block .text .newslist li {
	margin-bottom: 5px;
}
.page2nd .block.athome_btn {
	justify-content: center;
}
.page2nd .block.athome_btn .text {
	width: auto;
}
.page2nd .block.athome_btn .text a.eco_btn {
	display: block;
	background: #22AB37;
	color: #fff;
	font-size: 106%;
	text-decoration: none;
	border-radius: 6px;
	padding: .5rem 2rem;
}
.page2nd .block.athome_btn .text a.eco_btn:hover {
	opacity: .8;
	transition: .3s all;
}
.sub_box {
	background: #fffaf0;
	margin-top: 10px;
	padding: 5px;
}
.sub_box ul {
	margin: 0;
}
.sub_box ul li {
	text-indent: -.8rem;
	padding-left: 1rem;
}
.column h4 {	
  font-family: 'M PLUS Rounded 1c', sans-serif;
  font-size: 106%;
  text-decoration: underline;
}
.li_stylenone {
	list-style-type: none;
}
.dl_style dt {
	font-family: 'M PLUS Rounded 1c', sans-serif;
	font-weight: bold;
	margin-bottom: 5px;
}
.dl_style dd {	
	margin-bottom: 20px;
}
.page2nd .page .child_link a {
	margin-bottom: 10px;
}
.page2nd .page .child_link .block {
	background: #eee;
	margin-left: 1rem;
	padding: 1rem 1.5rem;
}
.page2nd .page .child_link .block p,
.page2nd .page .child_link .block a {
	font-size: 66%;
	margin-bottom: 10px;
}.page2nd .page .child_link .block p {
	color: navy;
	font-size: 74%;
}