.multi_table > .title,
.ecology .title { 
  color: #9c7e48;
  font-size: 21px;
  line-height: calc(29/21);
  letter-spacing: -0.02em;
  margin-top: 15px;
  margin-bottom: 9px;
}
@media (max-width: 768px) {
  .multi_table > .title,
  .ecology .title { 
    font-size: calc( 16 * 2 / var(--media_sp) * 100vw);
    line-height: calc(19/16);
    margin-top: calc( 27 / var(--media_sp) * 100vw);
    margin-bottom: calc( 15 / var(--media_sp) * 100vw);
  }
}

.disaster_prevention,
.ecology,
.performance {
  padding-top: 60px;
}
@media (max-width: 768px) {
  .disaster_prevention,
  .ecology,
  .performance {
    padding-top: calc( 34 / var(--media_sp) * 100vw);
  }
}

section .inner_content-wrap {
  padding: 0px calc( 40 / var(--media_sp) * 100vw) calc( 30 / var(--media_sp) * 100vw);
}
@media (max-width: 768px) {
}

.sec_main_content {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0 40px;
  margin-bottom: 35px;
}
.sec_main_content .common_block {
  padding-bottom: 27px;
}
.sec_main_content .common_block .img-wrap {
  margin: 12px auto 0;
}
.grid_a,
.grid_b,
.grid_c,
.grid_d {
  border-bottom: solid 1px #9c7e48;;
}
.grid_a {
  grid-row: 1/3;
  grid-column: 1/2;
}
.grid_b {
  grid-row: 1/3;
  grid-column: 2/3;
}
.grid_c {
  grid-row: 1/2;
  grid-column: 3/4;
}
.grid_d {
  grid-row: 2/3;
  grid-column: 3/4;
}
.grid_e {
  grid-row: 3/4;
  grid-column: 1/2;
}
.grid_f {
  grid-row: 3/4;
  grid-column: 2/3;
}
.grid_g {
  grid-row: 3/4;
  grid-column: 3/4;
}

.grid_a .img-wrap {
  width: 272px;
}
.grid_c .img-wrap {
  width: 177px;
}
.grid_e .img-wrap {
  width: 362px;
}
.grid_f .img-wrap {
  width: 336px;
}
.grid_g .img-wrap {
  width: 374px;
}
.sec_main_content .grid_c .img-wrap {
  margin-top: initial;
}
.sec_main_content .common_block.grid_c {
  padding-bottom: 0px;
}
.sec_main_content .common_block.grid_c .caption {
  right: -10px;
}
.sec_main_content .common_block.grid_d {
  padding-bottom: initial;
  padding-top: 10px;
  align-items: center;
}
.sec_main_content .common_block.grid_e,
.sec_main_content .common_block.grid_f,
.sec_main_content .common_block.grid_g {
  padding-top: 8px; 
}
.common_block.grid_a .caption,
.common_block.grid_e .caption,
.common_block.grid_f .caption,
.common_block.grid_g .caption {
  bottom: -1.5em;
}
@media (max-width: 768px) {
  .sec_main_content {
    display: block;
    margin-bottom: calc( 41 / var(--media_sp) * 100vw);
  }
  .sec_main_content .common_block {
    padding-bottom: 0;
  }
  .sec_main_content .common_block .img-wrap {
    margin-top: calc( 12 / var(--media_sp) * 100vw);
  }
  .grid_a,
  .grid_b,
  .grid_c,
  .grid_d {
    border-bottom: initial;
  }
  .sec_main_content > * + * {
    border-top: solid 1px #9c7e48;
    margin-top: calc( 39 / var(--media_sp) * 100vw);
    padding-top: calc( 16 / var(--media_sp) * 100vw);
    padding-bottom: 0;
  }
  
  .sec_main_content .grid_a .img-wrap {
    display: block;
    padding-top: calc( 12 / var(--media_sp) * 100vw);
    width: calc( 419 / var(--media_sp) * 100vw);
    right: calc( 50 / var(--media_sp) * 100vw);
    margin-bottom: calc( 68 / var(--media_sp) * 100vw);
  }
  .grid_c .img-wrap {
    width: calc( 211 / var(--media_sp) * 100vw);
  }
  .grid_e .img-wrap {
    width: calc( 495 / var(--media_sp) * 100vw);
  }
  .grid_f .img-wrap {
    width: calc( 496 / var(--media_sp) * 100vw);
  }
  .grid_g .img-wrap {
    width: calc( 528 / var(--media_sp) * 100vw);
  }
  .sec_main_content .grid_c .img-wrap {
    margin-top: initial;
  }
  .sec_main_content .common_block.grid_c {
    padding-bottom: 0px;
    display: grid;
    grid-template-columns: 395fr 254fr;
    gap: 1vw;
  }
  .sec_main_content .common_block.grid_c .title {
    grid-row: 1/2;
    grid-column: 1/2;
  }
  .sec_main_content .common_block.grid_c .text {
    grid-row: 2/3;
    grid-column: 1/2;
    align-self: flex-start;
  }
  .sec_main_content .common_block.grid_c .img-wrap {
    grid-row: 1/4;
    grid-column: 2/3;
  }
  .sec_main_content .common_block.grid_c .img-wrap .caption {
    right: calc( -14 / var(--media_sp) * 100vw);
    bottom:  calc( -18 / var(--media_sp) * 100vw);
  }
  .sec_main_content .common_block.grid_c .img-wrap img {
    top: calc( 14 / var(--media_sp) * 100vw);
    right: calc( 18 / var(--media_sp) * 100vw);
    position: relative;     
  }
  .sec_main_content .common_block.grid_c .caption {
    right: calc( -10 / var(--media_sp) * 100vw);
  }
  .sec_main_content .common_block.grid_d {
    padding-bottom: initial;
    padding-top: calc( 10 / var(--media_sp) * 100vw);
    align-items: center;
  }
  .sec_main_content .common_block.grid_e,
  .sec_main_content .common_block.grid_f,
  .sec_main_content .common_block.grid_g {
    padding-top: calc( 16 / var(--media_sp) * 100vw);
  }
  .sec_main_content .common_block.grid_e {
    padding-bottom: calc( 30 / var(--media_sp) * 100vw);
  }
  .sec_main_content .common_block.grid_f {
    padding-bottom: calc( 30 / var(--media_sp) * 100vw);
  }
  .common_block.grid_a .caption,
  .common_block.grid_e .caption,
  .common_block.grid_f .caption{
    bottom: -1.7em;
  }
  .common_block.grid_g .caption {
    bottom: -0.3em;
  }
}

.zehm {
  background-color: #fff;
  width: 100%;
  position: relative;
}
.zehm .img-wrap {
  max-width: 1183px;
  margin: 0 auto;
  height: 115px;
  display: grid;
  place-content: center;
  margin-bottom: 40px;
}
.zehm .caption {
  color: #333;
}
@media (max-width: 768px) {
  .zehm  {
    padding: calc( 40 / var(--media_sp) * 100vw) calc( 40 / var(--media_sp) * 100vw) calc( 35 / var(--media_sp) * 100vw);
  }
  .zehm .img-wrap {
    max-width: initial;
    height: auto;
    display: grid;
    place-content: center;
    margin-bottom: initial;
  }
  .zehm .caption {
    display: block;
    position: relative;
    top:initial;
    right: initial;
    margin: 0 auto;
    padding: initial;
    line-height: calc(15/10);
    margin-top: 1.2vw;
  } 
}


.eco_system-wrap {
  display: grid;
  grid-template-columns: 562fr 678fr;
  gap: 40px;
}
.eco_content {
  background-color: #fff;
}
.eco_content .title-wrap {
  text-align: center;
  background-color: #9c7e48;
}
.eco_content .title-wrap .title {
  color: #fff;
  font-size: 21px;
  line-height: calc(29/21);
  padding: 10px 0;
}
.eco_system-wrap .text {
  font-size: 15px;
  line-height: calc(25/15);
  align-self: auto;
}
.eco_content .content-wrap {
  background-color: #fff;
}
.eco_system-wrap .bels .grid-wrap {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 20px;
  gap: 20px;
}
.eco_system-wrap .energy > .grid-wrap {
  display: grid;
  grid-template-columns: 350fr 270fr;
  background-color: #fff;
  padding: 20px;
  gap: 20px;
}
.eco_system-wrap .solar > .grid-wrap {
  display: grid;
  grid-template-columns: 178fr 155fr; 
  gap: 0 10px;
  align-items: flex-start;
}
.eco_system-wrap .solar .title {
  grid-row: 1/2;
  grid-column: 1/2
}
.eco_system-wrap .solar .text {
  grid-row: 2/3;
  grid-column: 1/2
}
.eco_system-wrap .solar .img-wrap {
    grid-row: 1/4;
  grid-column: 2/3;
}
.eco_system-wrap .enefarm .img-wrap {
  width: 216px;
  margin:12px auto 0;
}
@media (max-width: 768px) {
  .eco_system-wrap {
    display: block;
  }
  .eco_content {
    margin-top: calc( 40 / var(--media_sp) * 100vw);
  }
  .eco_content .title-wrap .title {
    font-size: calc( 14 * 2 / var(--media_sp) * 100vw);
    line-height: calc(18/14);
    padding: calc( 16 / var(--media_sp) * 100vw) 0;
  }
  .eco_system-wrap .text {
    font-size: calc( 12 * 2 / var(--media_sp) * 100vw);
    line-height: calc(18/12);
    margin-bottom: calc( 30 / var(--media_sp) * 100vw);
  }
  .eco_system-wrap .enefarm .text {
    margin-bottom: 0;
  }
  .eco_system-wrap .bels .grid-wrap {
    display: block;
    padding: calc( 24 / var(--media_sp) * 100vw) calc( 30 / var(--media_sp) * 100vw) calc( 40 / var(--media_sp) * 100vw);
  }
  .eco_system-wrap .bels .grid-wrap .img-wrap {
    width: calc( 445 / var(--media_sp) * 100vw);
    margin: 0 auto;
  }
  .eco_system-wrap .energy > .grid-wrap {
    display: block;
    padding: calc( 16 / var(--media_sp) * 100vw) calc( 30 / var(--media_sp) * 100vw) calc( 26 / var(--media_sp) * 100vw);
  }
  .eco_system-wrap .solar  {
    margin-bottom: 2.5vw;
  }
  .eco_system-wrap .solar > .grid-wrap {
    display: grid;
    grid-template-columns: 311fr 263fr; 
    gap: 0 calc( 20 / var(--media_sp) * 100vw) ;
    align-items: flex-start;
  }
  .eco_system-wrap .content-wrap .title {
    font-size: calc( 14 * 2 / var(--media_sp) * 100vw);
  }
  .eco_system-wrap .solar .title {
    grid-row: 1/2;
    grid-column: 1/2
  }
  .eco_system-wrap .solar .text {
    grid-row: 2/3;
    grid-column: 1/2
  }
  .eco_system-wrap .solar .img-wrap {
      grid-row: 1/4;
    grid-column: 2/3;
    top: 1.5vw;
  }
  .eco_system-wrap .enefarm .img-wrap {
    width: calc( 334 / var(--media_sp) * 100vw);
    margin:calc( 12 / var(--media_sp) * 100vw) auto 0;
  }
}


.disaster_prevention .triplet {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  margin-top: 32px;
  margin-bottom: 34px;
}
.disaster_prevention .earthquake .img-wrap {
  top: -9px;
  display: block;
  position: relative;
}
.disaster_prevention .earthquake .caption {
  bottom: -1.4em;
}
.disaster_prevention .doublet {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin-bottom: 40px;
}
.disaster_prevention .doublet .title {
  margin-top: initial;  
}
.disaster_prevention .doublet .common_block {
  padding: 23px 30px 25px;
}
@media (max-width: 768px) {
  .disaster_prevention .triplet {
    margin-top: calc( 34 / var(--media_sp) * 100vw);
    margin-bottom: calc( 34 / var(--media_sp) * 100vw);
    display: block;
  }
  .disaster_prevention .triplet > * + * {
    margin-top: calc( 40 / var(--media_sp) * 100vw);
  }
  .disaster_prevention .earthquake .img-wrap {
    top: calc( -9 / var(--media_sp) * 100vw);
    margin-bottom: calc( 0 / var(--media_sp) * 100vw);
  }
  .disaster_prevention .earthquake .title {
    margin-top: calc( 12 / var(--media_sp) * 100vw);
  }
  .disaster_prevention .earthquake .caption {
    bottom: -1.4em;
  }
  .disaster_prevention .doublet {
    margin-bottom: calc( 40 / var(--media_sp) * 100vw);
    display :block;
  }
  .disaster_prevention .doublet > * + * {
    margin-top: calc( 40 / var(--media_sp) * 100vw);
  }
  .disaster_prevention .doublet .title {
    margin-top: initial;  
  }
  .disaster_prevention .doublet .common_block {
    padding: calc( 27/ var(--media_sp) * 100vw) calc( 40 / var(--media_sp) * 100vw) calc( 28 / var(--media_sp) * 100vw);
  }
}


.table_layout {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 40px;
  margin-top: 34px;
}
.table_layout .multi_table { 
  grid-column: 1/4;
}
.table_layout .multi_table .imgs_table-wrap {
  width: 100%;
  display: grid;
  grid-template-columns: 256fr 140fr 140fr 140fr 140fr 140fr;
  background-color: #9c7e48;
  gap: 1px;
  border: solid 1px #9c7e48;
}
.table_layout .multi_table .imgs_table-wrap .text .annotation {
  font-size: 12px;
}
.table_layout .multi_table .table01 {
  grid-row: 1/3;
  grid-column: 1/2;
  background-color: #fff;
}
.table_layout .multi_table .img-wrap {
  position: relative;
}
.table_layout .multi_table .num_label {
  position: absolute;
  right: 0;
  bottom: 0;
  background-color: #9c7e48;
  color: #fff;
  width: 17px;
  height: 17px;
  font-size: 13px;
  display: grid;
  place-content: center;
}
.table_layout .common_block {
 grid-column: 4/5;  
}
.table_layout .multi_table .table01.img-wrap {
  display: grid;
  place-content:center;
}
.table_layout .multi_table .table01 img{
  width: 89%;
  display: block;
  margin: 0 auto;
  position: relative;
}
@media (max-width: 768px) {
  .table_layout {
    display: block;
    margin-top: calc( 34 / var(--media_sp) * 100vw);
  }
  .table_layout .multi_table { 
    grid-column: 1/4;
  }
  .table_layout .multi_table > .text {
    font-size: calc( 12 * 2 / var(--media_sp) * 100vw);
    line-height: calc(18/12);
  }
  .table_layout .multi_table > .text .annotation {
    font-size: calc( 10 * 2 / var(--media_sp) * 100vw);
    line-height: calc(15/10);
  }
  .table_layout .multi_table .imgs_table-wrap {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
  }
  .table_layout .multi_table .table01 {
    grid-row: 1/3;
    grid-column: 1/2;
    background-color: #fff;
  }
  .table_layout .multi_table .img-wrap {
    position: relative;
  }
  .table_layout .multi_table .num_label {
    width: calc( 30 / var(--media_sp) * 100vw);
    height: calc( 30 / var(--media_sp) * 100vw);
    font-size: calc( 11 * 2 / var(--media_sp) * 100vw);
  }
  .table_layout .common_block {
    grid-column: 4/5;  
    margin-top: 4.8vw;
    width: calc( 320 / var(--media_sp) * 100vw);
  }
  .table_layout .multi_table .img-wrap,
  .table_layout .multi_table .img-wrap img {
    width: 100%;
    max-width: 100%;
  }
  .table_layout .multi_table .table01 {
    grid-row: 1/2;
    grid-column: 1/3
  }
  .table_layout .multi_table .table01 img {
      width: 89%;
    margin: 4vw auto;
  }
}


.performance {
  padding-bottom: 90px;
}
.ecology .grid-wrap {
  display: grid;
  grid-template-columns: 600fr 640fr;
  gap: 0 40px;
  margin-top: 26px;
}
.ecology .grid-wrap .title {
  font-size: 22px;
  line-height: calc(29/22);
  margin-top: initial;
}
.ecology .grid-wrap .text {
  font-size: 15px;
  line-height: calc(25/15);
}
.ecology .ecojozu {
  grid-row: 1/3;
  grid-column: 1/2;
}
.ecology .loweglass {
  grid-row: 1/2;
  grid-column: 2/3;
  display: grid;
  grid-template-columns: 380fr 247fr;
  gap: 0 15px;
}
.ecology .insulation {
  grid-row: 2/3;
  grid-column: 2/3;
  display: grid;
  grid-template-columns: 405fr 210fr;
  gap: 0 25px;
  margin-top: 29px;
}
.ecology .templaoil {
  grid-row: 4/5;
  grid-column: 1/2; 
  display: grid;
  grid-template-columns: 332fr 250fr;
  gap: 0 20px;
  align-content: flex-start;
}
.ecology .charge {
  grid-row: 4/5;
  grid-column: 2/3; 
}
.ecology .templaoil,
.ecology .charge {
   margin-top: 47px;
}
.ecology .ecojozu .caption {
  bottom: -15px;
}
.ecology .insulation .caption {
    bottom: -25px;
}
.ecology .loweglass .title,
.ecology .insulation .title,
.ecology .templaoil .title{
   grid-row: 1/2;
  grid-column: 1/2;  
}
.ecology .loweglass .text,
.ecology .insulation .text,
.ecology .templaoil .text {
   grid-row: 2/3;
  grid-column: 1/2;  
}
.ecology .loweglass .img-wrap,
.ecology .insulation .img-wrap,
.ecology .templaoil .img-wrap{
   grid-row: 1/3;
  grid-column: 2/3; 
  align-self: center;
}
.ecology .loweglass .text .annotation {
  display: inline;
}
.ecology .ecojozu .img-wrap {
  margin-top: 28px;
}
.ecology .charge .img-wrap {
  float: right;
  width: 375px;
  margin-top: -33px;
}
.ecology .templaoil .text {
  align-self: flex-start;
}
@media (max-width: 768px) {
  .performance {
    padding-bottom: 90px;
  }
  .ecology .grid-wrap {
    display: block;
    margin-top: calc( 26 / var(--media_sp) * 100vw);
  }
  .ecology .grid-wrap > * + * {
    margin-top: calc( 58 / var(--media_sp) * 100vw);
    display: block;
  }
  .ecology .grid-wrap .title {
    font-size: calc( 16 * 2 / var(--media_sp) * 100vw);
    line-height: calc(19/16);
    margin-top: initial;
  }
  .ecology .grid-wrap .text {
    font-size: calc( 12 * 2 / var(--media_sp) * 100vw);
    line-height: calc(18/12);
  }
  .ecology .ecojozu {
    grid-row: 1/3;
    grid-column: 1/2;
  }
  .ecology .loweglass {
    display: block;
  }
  .ecology .insulation {
    margin-top: calc( 58 / var(--media_sp) * 100vw);
  }
  .ecology .templaoil {
    display: grid;
    grid-template-columns: 320fr 320fr;
    gap: 0 calc( 30 / var(--media_sp) * 100vw);
    align-content: flex-start;
  }
  .ecology .charge {
    grid-row: 4/5;
    grid-column: 2/3; 
  }
  .ecology .templaoil {
    margin-top: calc( 66 / var(--media_sp) * 100vw);
  }
  .ecology .charge {
    margin-top: calc( 28 / var(--media_sp) * 100vw);
    display: grid;
  }
  .ecology .ecojozu .caption {
    bottom: calc( -32 / var(--media_sp) * 100vw);
  }
  .ecology .insulation .caption {
      bottom: calc( -38 / var(--media_sp) * 100vw);
  }
  .ecology .loweglass .title,
  .ecology .insulation .title,
  .ecology .templaoil .title{
     grid-row: 1/2;
    grid-column: 1/3;  
     display: block;
  }
  .ecology .loweglass .text,
  .ecology .insulation .text,
  .ecology .templaoil .text {
     grid-row: 2/3;
    grid-column: 1/2;  
  }
  .ecology .loweglass .img-wrap,
  .ecology .insulation .img-wrap,
  .ecology .templaoil .img-wrap{
    margin: 0 auto;
  }
  .ecology .loweglass .img-wrap img,
  .ecology .insulation .img-wrap img,
  .ecology .templaoil .img-wrap img {
    width: 100%;
    
  }
  .ecology .loweglass .img-wrap {
    width: calc( 511 / var(--media_sp) * 100vw);
  }
  .ecology .insulation .img-wrap{
    width: calc( 444 / var(--media_sp) * 100vw);
  }
  .ecology .loweglass .text .annotation {
    display: inline;
  }
  .ecology .ecojozu .img-wrap {
    margin-top: 28px;
  }
  .ecology .charge .img-wrap {
    float: initial;
    width: 100%;
    margin-top: calc( 26 / var(--media_sp) * 100vw);
    grid-row: 3/4;
  }
  .ecology .templaoil .text {
    align-self: flex-start;
  }
}

.performance .doublet {
  display: grid;
  grid-template-columns: 700fr 550fr;
  gap: 30px;
}
.performance .first-block,
.performance .second-block {
  display: grid;
  align-content: baseline;
}
.performance .first-block {
  grid-template-columns: 320fr 360fr;
  gap: 0 20px;
}
.performance .second-block {
  grid-template-columns: 270fr 255fr;
  gap: 0 25px; 
}
.performance .doublet .title {
  grid-row: 1/2;
  grid-column: 1/3;
}
.performance .doublet .text {
  grid-row: 2/3;
  grid-column: 1/2;
}
.performance .doublet .img-wrap {
  grid-row: 2/3;
  grid-column: 2/3;
}
@media (max-width: 768px) {
  .performance .doublet {
    display: block;
  }
  .performance .first-block,
  .performance .second-block {
    display: block;
  }
  .performance .first-block .img-wrap  {
    width: calc( 470 / var(--media_sp) * 100vw);
    margin: 2vw auto;
  }
  .performance .second-block .img-wrap {
    width: calc( 468 / var(--media_sp) * 100vw);
    margin: 2vw auto;
  } 
  .performance .second-block {
    grid-template-columns: 270fr 255fr;
    gap: 0 25px; 
  }
  .performance .doublet .title {
    grid-row: 1/2;
    grid-column: 1/3;
  }
  .performance .doublet .text {
    grid-row: 2/3;
    grid-column: 1/2;
  }
  .performance .doublet .img-wrap {
    grid-row: 2/3;
    grid-column: 2/3;
  }
}