@charset "utf-8";

/* 先進的窓リノベには断熱性能「S」以上が必要 */
.un_informationJutakuShoene2026MadoRenovation_insulationTable_wrapper {
    & + .un_informationJutakuShoene2026_note {
    margin-top: 30px;
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable {
  width: 100%;
  border-collapse: collapse;

  & th {
    font-size: 16px;
    background: #F2F2F2;
  }

  & th,
  & td {
    padding: 15px 5px;
    border: 1px solid #bdbdbd;
    text-align: center;
    vertical-align: middle;
  }

  &.un_informationJutakuShoene2026MadoRenovation_insulationTable__2 {
    th {
      padding: 15px 5px;
    }
    .un_informationJutakuShoene2026MadoRenovation_insulationTable_rank {
      & span {
        letter-spacing: 0.2em;
      }
    }

    & figcaption {
      padding-top: 5px;
    }
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_logoWidth {
  width: 21.5%;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_logo {
  & img {
    width: 140px;
    height: auto;
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_bg {
  background: #F2F2F2;
  width: 16%;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_rank {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 33px;
  margin: 0 8px;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_rank {
  & span {
    writing-mode:vertical-rl;
    text-orientation:upright;
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_fNormal {
  font-weight: normal;
  font-size: 14px;

  span {
    font-size: 14px;
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_fBold {
  font-weight: bold;
  font-size: 16px;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_price {
  font-size: 16px;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_rank_arrow {
  position: relative;
  width: 24px;
  height: 120px;
  background: #BFBFBF;

  &:before {
    content: "";
    position: absolute;
    top: -24px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 25px solid transparent;
    border-right: 25px solid transparent;
    border-bottom: 25px solid #BFBFBF;
  }
  
  &::after {
    content: "";
    position: absolute;
    bottom: -24px;
    left: 50%;
    transform: translateX(-50%);
    border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-top: 25px solid #BFBFBF;
  }
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark_wrapper {
  position: relative;
}
.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark {
  z-index: 1;

  &::before {
    content: "";
    position: absolute;
    width: 8px;
    height: 50px;
    transform: translateX(-50%);
  }

  &::after {
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    border-radius: 50%;
  }

  &.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark__green {
    &::before {
      background: #39a400;
      height: 45px;
      right: 41%;
      top: 30px;
    }
    &::after {
      background: #39a400;
      box-shadow: 0 64px 0 #39a400; /* ←下の〇 */
      top: 18%;
      right: 39%;
    }
  }

  &.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark__gray {
    background: #7F7F7F;

    &::before {
      background: #7F7F7F;
    }
    &::after {
      background: #7F7F7F;
      box-shadow: 0 84px 0 #7F7F7F;
    }
  }

  &.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark__2row {
    &::before {
      top: 65%;
    }
    &::after {
      box-shadow: 0 64px 0 #7F7F7F;
      right: 43%;
      top: 25%;
    }
  }

  &.un_informationJutakuShoene2026MadoRenovation_insulationTable_mark__3row {
    &::before {
      top: 59%;
      height: 86px;
      right: 38%;
    }
    &::after {
      box-shadow: 0 105px 0 #7F7F7F;
      top: 20%;
    }
  }
}

/* みらいエコ住宅バナー */
.un_informationJutakuShoene2026_madoRenovation_btnBnr {
  position: relative;
  margin-top: 20px;

  .un_informationJutakuShoene2026_madoRenovation_btnBnr_img {
    & img {
      width: 755px;
      height: auto;
      display: block;
    }
  }

  .un_informationJutakuShoene2026_madoRenovation_btnBnr_link {
    position: absolute;
    top: 50%;
    right: 80px;
    transform: translateY(-50%);

    & a {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 140px;
      height: 33px;
      border: 1.5px solid #d9d9d9;
      border-radius: 9999px;
      background: #fff;
      color: #333;
      font-size: 16px;
      text-decoration: none;
    }
  }

  & + .el_hdg3 {
    margin-top: 30px;
  }
}
.el_hdg3 {
  & + .un_windowTop_itemList {
    margin-top: 20px;
  }
}