@import url("https://fonts.googleapis.com/icon?family=Material+Icons");
/********************************************************

setting

********************************************************/
:root {
  --margin-block: 200px; }

@media (min-width: 1101px) and (max-width: 1280px) {
  :root {
    --margin-block: 120px; } }
@media (min-width: 641px) and (max-width: 1100px) {
  :root {
    --margin-block: 90px; } }
@media (max-width: 640px) {
  :root {
    --margin-block: 70px; } }
.sec_efficiency img {
  width: 100%; }
.sec_efficiency .box_wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap; }
.sec_efficiency .box {
  margin-bottom: calc( var(--margin-block) / 3 ); }
  .sec_efficiency .box .text {
    font-size: 14px;
    line-height: 2.2;
    margin-top: 15px; }
    @media screen and (min-width: 750px) {
      .sec_efficiency .box .text {
        font-size: calc(14px + 0.0034188034 * (100vw - 750px)); } }
    @media screen and (min-width: 1920px) {
      .sec_efficiency .box .text {
        font-size: 18px; } }
    @media screen and (max-width: 600px) {
      .sec_efficiency .box .text {
        line-height: 1.8; } }
    .sec_efficiency .box .text .text-caption {
      font-size: 10px;
      margin-top: 15px; }
      @media screen and (min-width: 750px) {
        .sec_efficiency .box .text .text-caption {
          font-size: calc(10px + 0.0017094017 * (100vw - 750px)); } }
      @media screen and (min-width: 1920px) {
        .sec_efficiency .box .text .text-caption {
          font-size: 12px; } }

.zeh_block {
  background: #dde8e4;
  padding: calc( var(--margin-block) / 2 ) 0; }

.zeh_block .zeh_title .zeh_logo {
  width: min(90%, 630px);
  margin: 0 auto 40px; }
.zeh_block .zeh_title .title_text {
  text-align: center;
  font-size: 14px;
  line-height: 1.6;
  margin-bottom: 60px; }
  @media screen and (min-width: 750px) {
    .zeh_block .zeh_title .title_text {
      font-size: calc(14px + 0.0102564103 * (100vw - 750px)); } }
  @media screen and (min-width: 1920px) {
    .zeh_block .zeh_title .title_text {
      font-size: 26px; } }
  @media screen and (max-width: 600px) {
    .zeh_block .zeh_title .title_text {
      margin-bottom: 40px; } }

.zeh_block .box_wrap {
  width: min(90%, 1240px);
  margin: 0 auto; }
  .zeh_block .box_wrap .box {
    width: min(48.5%, 600px); }
    @media screen and (max-width: 600px) {
      .zeh_block .box_wrap .box {
        width: 100%; } }

.eco_block {
  background: #272f36;
  padding: calc( var(--margin-block) / 1.5 ) 0;
  color: #FFF; }

.eco_block .eco_title {
  text-align: center;
  font-size: 30px;
  margin-bottom: 30px;
  color: #a69a68;
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal; }
  @media screen and (min-width: 750px) {
    .eco_block .eco_title {
      font-size: calc(30px + 0.0256410256 * (100vw - 750px)); } }
  @media screen and (min-width: 1920px) {
    .eco_block .eco_title {
      font-size: 60px; } }
  @media screen and (max-width: 600px) {
    .eco_block .eco_title {
      margin-bottom: 10px;
      line-height: 1.2; } }

.eco_block .eco_box {
  width: min(90%, 1240px);
  margin: 0 auto; }
  .eco_block .eco_box .box_wrap .box {
    width: min(48.5%, 600px); }
    @media screen and (max-width: 600px) {
      .eco_block .eco_box .box_wrap .box {
        width: 100%; } }
  @media screen and (max-width: 600px) {
    .eco_block .eco_box .box {
      margin-bottom: 50px; } }
  .eco_block .eco_box .box .img_wrap {
    display: flex;
    background: #FFF;
    padding: 30px;
    align-items: center;
    flex-wrap: wrap; }
    @media screen and (max-width: 600px) {
      .eco_block .eco_box .box .img_wrap {
        padding: 15px; } }
    .eco_block .eco_box .box .img_wrap.img_eco-system .img {
      width: 50%; }
      @media screen and (max-width: 600px) {
        .eco_block .eco_box .box .img_wrap.img_eco-system .img {
          width: 100%; } }
    .eco_block .eco_box .box .img_wrap.img_shower .img:first-child {
      width: min(59%, 736px); }
      @media screen and (max-width: 600px) {
        .eco_block .eco_box .box .img_wrap.img_shower .img:first-child {
          width: 100%; } }
    .eco_block .eco_box .box .img_wrap.img_shower .img:last-child {
      width: min(34.5%, 403px);
      margin-left: 5%; }
      @media screen and (max-width: 600px) {
        .eco_block .eco_box .box .img_wrap.img_shower .img:last-child {
          width: 100%;
          margin-left: 0;
          margin-top: 20px; } }
  .eco_block .eco_box .box .box_title {
    color: #c7b87b;
    font-size: 18px;
    margin-bottom: 20px; }
    @media screen and (min-width: 750px) {
      .eco_block .eco_box .box .box_title {
        font-size: calc(18px + 0.0068376068 * (100vw - 750px)); } }
    @media screen and (min-width: 1920px) {
      .eco_block .eco_box .box .box_title {
        font-size: 26px; } }