@charset "utf-8";

/* 見出し 新デザイン&余白設定 */

/* h2（.el_hdg2） */
.un_sharedGasT_hdg2 {
  font-size: 24px;
  text-align: left;
  line-height: 1.2;
  color: var(--dekiruGreen);
  padding: 19px 10px 14px 20px;
  font-weight: bold;
  background: #d6ebcd;
  background: repeating-linear-gradient(-45deg, #d6ebcd 0, #d6ebcd 2px, #d9eec0 2px, #d9eec0 4px);
}
.el_annotation + .un_sharedGasT_hdg2,
.el_annotation_wrapper + .un_sharedGasT_hdg2,
.un_sharedGasT_compare_annotation + .un_sharedGasT_hdg2,
.un_sharedGasT_compare_seriesSummary + .un_sharedGasT_hdg2 {
  margin-top: 70px;
}
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_hdg2 {
  margin-top: 50px;
}
.el_annotation + .un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg,
.el_annotation_wrapper + .un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg,
.un_sharedGasT_compare_annotation + .un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg,
.un_sharedGasT_compare_seriesSummary + .un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg {
  margin-top: 40px;
}
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg {
  margin-top: 20px;
}
.un_sharedGasT_hdg2.un_sharedGasT_hdg2__1stHdg + .un_sharedGasT_compare_seriesCardUnit {
  margin-top: 10px;
}

/* h3（.el_hdg3） */
.un_sharedGasT_hdg3 {
  font-size: 20px;
  background: repeating-linear-gradient(-45deg, var(--secondBgColor) 0, var(--secondBgColor) 2px, #f6f6f6 2px, #f6f6f6 4px);
  color: var(--dekiruGreen);
  line-height: 1.2;
  padding: 13px 10px 9px 20px;
  border: 1px #ddd solid;
  border-bottom: var(--dekiruGreen) solid 2px;
  font-weight: bold;
  text-align: left;

  &.un_sharedGasT_hdg3__withBadge {
    display: flex;
    align-items: center;

    .un_sharedGasT_hdg3_inner {
      flex: 1;
    }

    .un_sharedGasT_hdg3_badge2 {
      color: var(--dekiruGreen);
      background-color: #fff;
      border: solid 1px var(--dekiruGreen);
      font-weight: bold;
      margin-right: 10px;
      padding: 1px 10px;
      border-radius: 3px;
      line-height: 2;
      font-size: 15px;
    }
  }
}

.un_sharedGasT_hdg2 + .un_sharedGasT_hdg3 {
  margin-top: 20px;
}
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_hdg3,
.bl_mediaPanel.bl_mediaPanel__noBorder:not(.bl_mediaPanel__noPadding) + .un_sharedGasT_hdg3 {
  margin-top: 40px;
}
.un_sharedGasT_compare_table_wrapper.un_sharedGasT_compare_table_wrapper__padding + .un_sharedGasT_hdg3,
.un_sharedGasT_compare_pointPanel_wrapper + .un_sharedGasT_hdg3,
.bl_panel.bl_panel__banner + .un_sharedGasT_hdg3 {
  margin-top: 60px;
}
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_hdg3.un_sharedGasT_hdg3__1stHdg,
.bl_mediaPanel.bl_mediaPanel__noBorder:not(.bl_mediaPanel__noPadding) + .un_sharedGasT_hdg3.un_sharedGasT_hdg3__1stHdg {
  margin-top: 10px;
}
.un_sharedGasT_compare_table_wrapper.un_sharedGasT_compare_table_wrapper__padding + .un_sharedGasT_hdg3.un_sharedGasT_hdg3__1stHdg,
.un_sharedGasT_compare_pointPanel_wrapper + .un_sharedGasT_hdg3.un_sharedGasT_hdg3__1stHdg {
  margin-top: 30px;
}
.un_sharedGasT_compare_h3HHdgCont {
  margin-top: 60px;
}

/* h4（.el_hdg4） */
.un_sharedGasT_hdg4 {
  background: var(--secondBgColor);
  background: repeating-linear-gradient(-45deg, var(--secondBgColor) 0, var(--secondBgColor) 2px, #f6f6f6 2px, #f6f6f6 4px);
  box-sizing: border-box;
  color: #555;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.2;
  margin-top: 20px;
  padding: 15px 10px 12px 15px;
}
.un_sharedGasT_hdg4 + .bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) {
  padding-top: 10px;
}
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_hdg4.un_sharedGasT_hdg4__1stHdg {
  margin-top: 0;
}
.un_sharedGasT_compare_pointPanel_wrapper + .un_sharedGasT_hdg4 {
  margin-top: 40px;
}
.un_sharedGasT_compare_pointPanel_wrapper + .un_sharedGasT_hdg4.un_sharedGasT_hdg4__1stHdg {
  margin-top: 20px;
}
.un_sharedGasT_hdg4 + .bl_mediaPanel.bl_mediaPanel__noBorder.bl_mediaPanel__noPadding {
  margin-top: 20px;
}


/* ===== ページリニューアル　新規CSS ===== */
.un_sharedGasT_compare_emphasisBlackTxt {
  font-weight: bold;
}
.un_sharedGasT_compare_emphasisMediumTxt {
  font-size: 16px;
}
.un_sharedGasT_compare_emphasisLargeTxt {
  font-size: 18px;
}
.un_sharedGasT_compare_annotation {
  box-sizing: border-box;
  display: inline-block;
  text-align: right;
  width: 100%;

  &.un_sharedGasT_compare_annotation__txtL {
    text-align: left;
  }

  &.un_sharedGasT_compare_annotation__mT {
    margin-top: 10px;
  }
}
.un_sharedGasT_compare_superScript {
  vertical-align: text-top;
  font-size: 12px;
}


/* タブ切替 */
.un_sharedGasT_compare_tabUnit {
  align-items: flex-end;
  display: flex;
  flex-wrap: wrap;
  margin-top: 15px;

  .un_sharedGasT_compare_tabSwitch {
    display: none;
  }

  .un_sharedGasT_compare_tabLabel {
    align-items: center;
    background: #dfeadc;
    box-sizing: border-box;
    border-radius: 10px 10px 0 0;
    color: #3e692b;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 20px;
    height: 70px;
    justify-content: center;
    order: -1;
    position: relative;
    text-align: center;
    word-break: break-all;
    z-index: 1;

    &:not(:last-of-type) {
      margin-right: 10px;
    }

    &::after {
      content: "";
      width: calc(100% + 10px);
      height: 6px;
      background: var(--dekiruGreen);
      display: block;
      order: -1;
      left: 0;
      position: absolute;
      bottom: 0;
      z-index: 1;
    }

    &:last-of-type::after {
      width: 100%;
    }

    .un_sharedGasT_compare_tabLabel_icon {
      height: auto;
      margin-right: 10px;
      width: 52px;
    }
  }

  .un_sharedGasT_compare_tabSwitch:checked + .un_sharedGasT_compare_tabLabel {
    background: var(--dekiruGreen);
    color: #fff;
    font-weight: bold;
    height: 78px;

    & > *  {
      font-weight: bold;
    }
  }

  .un_sharedGasT_compare_tabSwitch:checked + .un_sharedGasT_compare_tabLabel + .un_sharedGasT_compare_tabContent {
    height: auto;
    overflow: auto;
    padding-top: 10px;
    opacity: 1;
    transition: 0.5s opacity;
  }

  .un_sharedGasT_compare_tabContent {
    width: 100%;
    height: 0;
    overflow: hidden;
    opacity: 0;
  }

  .un_sharedGasT_compare_tabSwitch.un_sharedGasT_compare_tabSwitch__withAutoGrill {
    + .un_sharedGasT_compare_tabLabel::before {
      content: url('/gastable/contents/img/compare_shared/icon_fish_off.png');
      position: absolute;
      left: 45px;
      top: 16px;
    }

    + .un_sharedGasT_compare_tabLabel .un_sharedGasT_compare_tabLabel_txt {
      padding-left: 35px;
    }

    &:checked + .un_sharedGasT_compare_tabLabel::before {
      content: url('/gastable/contents/img/compare_shared/icon_fish.png');
      left: 40px;
      top: 17px;
    }
  }
}


/* シリーズ（別商品）カード */
.un_sharedGasT_compare_seriesCardUnit {
  display: flex;
  gap: 10px;

  .un_sharedGasT_compare_seriesCard {
    border-bottom: 1px solid #bfbfbf;
    border-left: 1px solid #bfbfbf;
    border-right: 1px solid #bfbfbf;
    border-top: 8px solid #bfbfbf;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    padding: 10px;
    width: calc((100% - 10px) / 3);

    .un_sharedGasT_compare_seriesCard_top_imgs {
      align-items: center;
      display: flex;
      flex-direction: column;
    }

    .un_sharedGasT_compare_seriesCard_top_imgs_makerLogo + .un_sharedGasT_compare_seriesCard_top_imgs_productImg {
      margin-top: 15px;
    }

    .un_sharedGasT_compare_seriesCard_top_imgs_productImg img {
      height: auto;
      width: 100%;
      max-width: 100%;
    }

    .un_sharedGasT_compare_seriesCard_top_imgs_productImg + .un_sharedGasT_compare_seriesCard_top_imgs_seriesLogo {
      margin-top: 15px;
    }

    .un_sharedGasT_compare_seriesCard_top_imgs_seriesLogo {
      min-height: 54px;
      text-align: center;
    }

    .un_sharedGasT_compare_seriesCard_top_imgs_seriesLogo img + figcaption {
      margin-top: 5px;
    }

    .un_sharedGasT_compare_seriesCard_top_decoration {
      border-top: 1px solid var(--defaultTxtColor);
      display: flex;
      flex-direction: column;
      font-size: 16px;
      font-weight: bold;
      margin: 15px 0 0 auto;
      padding-top: 5px;
      position: relative;
      text-align: center;
      width: 90%;
    }

    .un_sharedGasT_compare_seriesCard_top_decoration_img {
      height: auto;
      left: -22px;
      position: absolute;
      top: -20px;
      width: 50px;
    }

    .un_sharedGasT_compare_seriesCard_top_decoration_txt {
      margin-right: 10px;
    }

    .un_sharedGasT_compare_seriesCard_top_decoration + .un_sharedGasT_compare_seriesCard_top_list {
      margin-top: 15px;
    }

    .un_sharedGasT_compare_seriesCard_top_list {
      margin-left: 20px;
      padding-left: 3px;
    }
      
    .un_sharedGasT_compare_seriesCard_top_list li {
      display: list-item;
      text-indent: 0;
      padding-left: 0;
    }

    .un_sharedGasT_compare_seriesCard_top_list li + li {
      padding-top: 3px;
    }

    .un_sharedGasT_compare_seriesCard_top + .un_sharedGasT_compare_seriesCard_bottom {
      margin-top: 10px;
    }

    .un_sharedGasT_compare_seriesCard_bottom {
      align-items: flex-end;
      display: flex;
      flex: 1;
      flex-wrap: wrap;
    }

    .un_sharedGasT_compare_seriesCard_bottom_hdg {
      background: var(--secondBgColor);
      text-align: center;
      width: 100%;
      padding: 5px 0 4px;
    }

    .un_sharedGasT_compare_seriesCard_bottom_hdg + .un_sharedGasT_compare_seriesCard_bottom_price {
      margin-top: 5px;
    }

    .un_sharedGasT_compare_seriesCard_bottom_price {
      color: var(--emphasisRed);
      font-weight: bold;
      text-align: center;
      width: 100%;
    }

    .un_sharedGasT_compare_seriesCard_bottom_price_num {
      font-size: 24px;
    }

    .un_sharedGasT_compare_seriesCard_bottom_price + .un_sharedGasT_compare_seriesCard_bottom_btn {
      margin-top: 5px;
    }

    .un_sharedGasT_compare_seriesCard_bottom_btn {
      font-size: 15px;
      width: 100%;
    }
  }

  + .un_sharedGasT_hdg2 {
    margin-top: 70px;
  }
}


/* 比較テーブル */
.bl_panel_wrapper.bl_panel_wrapper__padding + .un_sharedGasT_compare_table_wrapper,
.bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) + .un_sharedGasT_compare_table_wrapper,
.bl_mediaPanel.bl_mediaPanel__noBorder:not(.bl_mediaPanel__noPadding) + .un_sharedGasT_compare_table_wrapper {
  padding-top: 0;
}
.un_sharedGasT_compare_table_wrapper {
  padding: 20px 0 0;

  &.un_sharedGasT_compare_table_wrapper__padding {
    padding-left: 20px;
    padding-right: 20px;
  }

  + .un_sharedGasT_hdg3 {
    margin-top: 30px;
  }

  + .un_sharedGasT_hdg4 {
    margin-top: 20px;
  }

  + .bl_panel:not(.bl_panel__noPadding) {
    padding-top: 15px;
  }
}

.un_sharedGasT_compare_table {
  border-collapse: collapse;
  width: 100%;

  & tbody tr th {
    background-color: var(--secondBgColor);
    border: 1px solid #bfbfbf;
    padding: 10px;
    text-align: center;

    & img + img {
      margin-top: 5px;
    }
  }

  & tbody tr td {
    border: 1px solid #bfbfbf;
    padding: 10px;
    position: relative;
    box-sizing: border-box;

    & p + img {
      margin-top: 5px;
    }
  }

  & tbody tr:nth-child(2) td {
    text-align: center;
  }

  & img {
    height: auto;
    max-width: 100%;
  }

  .un_sharedGasT_compare_table_row1col1 {
    background-color: initial;
    border: none;
    font-size: 16px;
    padding: 15px 0;
    width: 108px;
  }

  .un_sharedGasT_compare_table_row1 {
    font-size: 15px;
    height: 47px;
    padding: 0 10px;
    width: 27%;

    & div {
      align-items: center;
      display: flex;
      justify-content: center;
    }

    .un_sharedGasT_compare_table_row1_txt {
      line-height: 1em;
      margin-top: 4px;
    }

    .un_sharedGasT_compare_table_row1_txt + .un_sharedGasT_compare_table_row1_img {
      margin-left: 12px;
    }
  }

  .un_sharedGasT_compare_table_heatAdjustTxt {
    font-size: 15px;
  }

  .un_sharedGasT_compare_table_col1 {
    font-weight: normal;
    padding: 10px;
  }

  .un_sharedGasT_compare_table_thMakerAndSeriesLogo img {
    display: block;
    margin: 0 auto;

    & + img {
      margin-top: 10px;
    }
  }

  .un_sharedGasT_compare_table_topPlateCompare {
    vertical-align: top;

    .un_sharedGasT_compare_table_topPlateCompare_ttl {
      background-color: #7f7f7f;
      border-radius: 5px;
      text-align: center;
      color: #fff;
    }

    .un_sharedGasT_compare_table_topPlateCompare_txt {
      margin-top: 10px;
    }
  }

  .un_sharedGasT_compare_table_moreInfoBtn {
    font-size: 15px;

    a:hover {
      color: #fff;
      text-decoration: none;
    }
  }

  .un_sharedGasT_compare_table_tdCenter {
    text-align: center;
    vertical-align: middle;
  }

  .un_sharedGasT_compare_table_tdNoCont {
    background-image: linear-gradient(to top left, transparent calc(50% - 1px), #bfbfbf, transparent calc(50% + 1px));

    &::before {
      background: #bfbfbf;
      height: 1px;
      position: absolute;
      right: -4px;
      top: 23px;
      transform: rotate(-15deg);
      width: 185px;
    }
  }

  .un_sharedGasT_compare_table_tdWithCaution {
    position: relative;

    &::before {
      background: var(--subBgGreen);
      border-radius: 50%;
      content: '';
      height: 40px;
      left: 16px;
      position: absolute;
      top: 4px;
      width: 40px;
    }

    &::after {
      color: var(--dekiruGreen);
      content: '!';
      font-size: 27px;
      font-weight: bold;
      left: 31px;
      position: absolute;
      top: 5px;
    }
  }

  .un_sharedGasT_compare_table_bgImg {
    opacity: 0.5;
  }

  & td:has(.un_sharedGasT_compare_table_txtWithBgImg) {
    height: 60px;
  }

  .un_sharedGasT_compare_table_txtWithBgImg {
    font-size: 16px;
    font-weight: bold;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
  }

  .un_sharedGasT_compare_table_tdLabel {
    border: 1px solid var(--defaultTxtColor);
    border-radius: 15px;
    line-height: 1em;
    padding: 5px 10px;

    & + img {
      margin-top: 10px;
    }
  }

  .un_sharedGasT_compare_table_tdContCenter {
    text-align: center;
  }

  &.un_sharedGasT_compare_table__spNoScroll {
    .un_sharedGasT_compare_table_row1 {
      width: 25%;
    }
  }

  &.un_sharedGasT_compare_table__functionCompareTable {
    .un_sharedGasT_compare_table_row1col1 {
      width: 80px;
    }

    .un_sharedGasT_compare_table_thMakerAndSeriesLogo {
      width: 28%;
    }

    .un_sharedGasT_compare_table_col1 {
      line-height: 1.2em;
      padding: 10px 0;

      &.un_sharedGasT_compare_table_col1__letterVertical {
        padding-left: 5px;
        padding-right: 5px;
      }

      &.un_sharedGasT_compare_table_col1__letterVertical .un_sharedGasT_compare_table_col1_verticalRotate {
        display: inline-block;
        line-height: 1em;
        margin-top: -2px;
        padding-top: 2px;
        transform: rotate(90deg);
      }
    }

    .un_sharedGasT_compare_table_tdCenter {
      padding: 10px 5px;
    }
  }
}


/* 2つ並び キャプション付き画像 */
.un_sharedGasT_hdg4 + .un_sharedGasT_compare_flexPanel_wrapper {
  margin-top: 10px;
}
.un_sharedGasT_compare_flexPanel {
  display: flex;
  justify-content: space-between;

  .un_sharedGasT_compare_flexPanel_img {
    position: relative;

    .un_sharedGasT_compare_flexPanel_img_txt {
      background-color: rgba(0, 0, 0, .5);
      color: #fff;
      left: 0;
      padding: 7px 10px 6px;
      position: absolute;
      top: 10px;
    }

    .un_sharedGasT_compare_flexPanel_img_emphasisTxt {
      background: #fff;
      border-radius: 20px;
      color: var(--emphasisRed);
      font-weight: bold;
      line-height: 1em;
      padding: 6px 20px 5px;
      position: absolute;
      right: 7px;
      top: 10px;
    }
  }
}
.un_sharedGasT_compare_flexPanel_wrapper + .bl_panel.bl_panel__noBorder.bl_panel__noPadding {
  margin-top: 10px;
}


/* チェックマーク付き ポイントパネル */
.el_annotation + .un_sharedGasT_compare_pointPanel_wrapper,
.bl_panel.bl_panel__noBorder.bl_panel__noPadding + .un_sharedGasT_compare_pointPanel_wrapper,
.bl_mediaPanel.bl_mediaPanel__noBorder.bl_mediaPanel__noPadding + .un_sharedGasT_compare_pointPanel_wrapper {
  margin-top: 20px;
}
.un_sharedGasT_compare_pointPanel_wrapper.un_sharedGasT_compare_pointPanel_wrapper__padding {
  padding-left: 20px;
  padding-right: 20px;
}
.un_sharedGasT_compare_pointPanel {
  border: 4px solid var(--dekiruGreen);
  font-size: 17px;
  font-weight: bold;
  padding: 20px 15px 20px 65px;
  position: relative;

  .un_sharedGasT_compare_pointPanel_txt {
    position: relative;

    &::before, &::after {
      content: "";
      display: block;
      position: absolute;
    }

    &::before {
      background: #2d9c00;
      border-radius: 20px;
      height: 30px;
      left: -47px;
      top: 50%;
      transform: translateY(-50%);
      width: 30px;
    }

    &::after {
      border-bottom: 4px solid #fff;
      border-left: 4px solid #fff;
      height: 7px;
      left: -40px;
      top: calc(50% - 7px);
      transform: rotate(-45deg);
      width: 13px;
    }

    & + .un_sharedGasT_compare_pointPanel_txt {
      margin-top: 15px;
    }
  }
}
.un_sharedGasT_compare_pointPanel_wrapper + .un_sharedGasT_hdg3 {
  margin-top: 60px;
}


/* 2つ並び キャプション付き画像（.bl_mediaPanelと併用するもの） */
.un_sharedGasT_compare_flexMediaPanel {
  display: flex;
  gap: 10px;
  justify-content: space-between;

  .un_sharedGasT_compare_flexMediaPanel_img {
    position: relative;
    width: calc((100% - 10px) / 2);

    .un_sharedGasT_compare_flexMediaPanel_img_ditail {
      position: absolute;
      padding: 5px 10px;
      top: 10px;
      left: 0;
      color: #fff;
      background-color: rgba(0, 0, 0, .5);
    }

    .un_sharedGasT_compare_flexMediaPanel_img_txt {
      margin-top: 5px;
    }

    .un_sharedGasT_compare_flexMediaPanel_img_emphasisTxt {
      background: #fff;
      border-radius: 20px;
      color: var(--emphasisRed);
      font-weight: bold;
      line-height: 1em;
      padding: 6px 20px 5px;
      position: absolute;
      right: 7px;
      top: 10px;
    }
  }
}


/* グリルの火力調整が異なる */
.un_sharedGasT_compare_flowImgs {
  display: flex;
  gap: 20px;

  .un_sharedGasT_compare_flowImgs_img {
    position: relative;

    & figcaption {
      font-size: 15px;
      font-weight: bold;
      text-align: center;
    }

    & figcaption + img {
      margin-top: 5px;
    }

    + .un_sharedGasT_compare_flowImgs_img::before {
      border-bottom: 12px solid transparent;
      border-left: 12px solid #7f7f7f;
      border-right: 0;
      border-style: solid;
      border-top: 12px solid transparent;
      content: '';
      height: 0;
      left: -16px;
      position: absolute;
      top: 50%;
      width: 0;
    }
  }
}


/* バーナーの最大火力を徹底比較 */
.un_sharedGasT_compare_table_burnerCompare {
  & img {
    height: auto;
    max-width: 100%;
  }

  .un_sharedGasT_compare_table_burnerCompare_point {
    align-items: center;
    display: flex;
    font-size: 15px;
    font-weight: bold;
    gap: 10px;
    justify-content: center;

    & img {
      height: auto;
      width: 32px;
    }

    & p {
      margin-top: 4px;
    }

    + .un_sharedGasT_compare_table_burnerCompare_txt {
      margin-top: 10px;
    }
  }

  .un_sharedGasT_compare_table_burnerCompare_txt {
    text-align: left;
  }
}


/*  左右のバーナー間隔を徹底比較 */
.un_sharedGasT_hdg3 + .un_sharedGasT_compare_burnerDistance {
  margin-top: 20px;
}
.un_sharedGasT_compare_burnerDistance {
  display: flex;
  gap: 20px;
  justify-content: space-between;

  .un_sharedGasT_compare_burnerDistance_card {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: calc((100% - 10px) / 2);

    .un_sharedGasT_compare_burnerDistance_card_imgSp {
      display: none;
    }

    .un_sharedGasT_compare_burnerDistance_card_pointTxt {
      align-items: flex-start;
      box-sizing: border-box;
      display: flex;
      font-size: 15px;
      gap: 10px;
      margin-top: 10px;
      width: 85%;

      & img {
        height: auto;
        width: 40px;
      }
    }
  }
}
.un_sharedGasT_compare_burnerDistancePointSp {
  display: none;
}


.un_sharedGasT_compare_tableTtlSp {
  display: none;
}
.un_sharedGasT_compare_tableTtlSp + .un_sharedGasT_compare_table_wrapper {
  padding-top: 30px;
}


/* 比較カード */
.bl_panel + .un_sharedGasT_compare_card {
  margin-top: 0;
}
.un_sharedGasT_hdg4 + .bl_panel.bl_panel__noBorder .un_sharedGasT_compare_card,
.bl_panel.bl_panel__noPadding + .un_sharedGasT_compare_card {
  margin-top: 10px;
}

.un_sharedGasT_compare_card {
  .un_sharedGasT_compare_card_list {
    display: flex;
    justify-content: space-between;

    .un_sharedGasT_compare_card_list_item {
      box-sizing: border-box;
      display: flex;
      flex-direction: column;
      width: calc((100% - 40px) / 3);

      .un_sharedGasT_compare_card_list_item_ttl {
        min-height: 55px;
      }

      .un_sharedGasT_compare_card_list_item_ttl_logo {
        text-align: center;
      }

      .un_sharedGasT_compare_card_list_item_ttl_logo + .un_sharedGasT_compare_card_list_item_ttl_name {
        margin-top: 8px;
      }

      .un_sharedGasT_compare_card_list_item_ttl_logo.un_sharedGasT_compare_card_list_item_ttl_logo__repla + .un_sharedGasT_compare_card_list_item_ttl_name {
        margin-top: 3px;
      }

      .un_sharedGasT_compare_card_list_item_ttl_name {
        font-size: 15px;
        font-weight: bold;
        text-align: center;
      }

      .un_sharedGasT_compare_card_list_item_ttl + .un_sharedGasT_compare_card_list_item_cont {
        margin-top: 8px;
      }

      .un_sharedGasT_compare_card_list_item_cont {
        display: flex;
        flex: 1;
        flex-direction: column;

        .un_sharedGasT_compare_card_list_item_cont_img {
          box-sizing: border-box;
          width: 100%;
        }

        .un_sharedGasT_compare_card_list_item_cont_img img {
          height: auto;
          width: 100%;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt {
          background: var(--secondBgColor);
          flex: 1;
          padding: 15px 10px;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt_emphasis {
          font-weight: bold;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt_middle {
          font-size: 17px;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt_large {
          font-size: 19px;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt_centerCont {
          text-align: center;
        }

        .un_sharedGasT_compare_card_list_item_cont_txt_centerCont + p {
          margin-top: 10px;
        }
      }

      &.un_sharedGasT_compare_card_list_item__emphasize {
        /* 緑枠・薄い緑背景・一部緑文字コンテンツ */

        .un_sharedGasT_compare_card_list_item_cont_txt {
          background: var(--subBgGreen);

          .un_sharedGasT_compare_card_list_item_cont_txt_emphasis {
            color: var(--dekiruGreen);
          }
        }
      }
    }
  }
}


/* シリーズまとめ */
.un_sharedGasT_hdg3 + .un_sharedGasT_compare_seriesSummary {
  margin-top: 20px;
}
.un_sharedGasT_compare_seriesSummary {
  padding-left: 20px;
  padding-right: 20px;

  .un_sharedGasT_compare_seriesSummary_main {
    display: flex;
    justify-content: space-between;
  
    .un_sharedGasT_compare_seriesSummary_main_info {
      width: 54%;

      .un_sharedGasT_compare_seriesSummary_main_info_logo {
        align-items: center;
        display: flex;
        gap: 20px;
      }

      .un_sharedGasT_compare_seriesSummary_main_info_review {
        align-items: center;
        display: flex;

        .un_sharedGasT_compare_seriesSummary_main_info_review_txt {
          padding: 5px 20px;
          margin: 18px 10px 0 0;
          background-color: var(--secondBgColor);
        }

        .review-summary-container {
          background-color: initial;
        }

        .review-summary-container:empty:before {
          content: 'レビューがありません';
          color: var(--weakTxtColor);
          font-size: 14px;
          text-align: left;
          display: block;
          padding: 5px 20px 5px 10px;
          margin-top: 18px;
          width: 185px;
        }

        .ukomistarRatingSummarySection {
          margin-top: 18px;
        }

        .ukomiAvr_wrapper {
          color:transparent;

          & [data-review-name] {
            font-size: 30px;
            font-weight: bold;
            color: #777;
            display:block;
          }
        }

        .review-summary-container .starRating {
          align-items: baseline;
        }
      }

      .un_sharedGasT_compare_seriesSummary_main_info_imgSp {
        display: none;
      }

      .un_sharedGasT_compare_seriesSummary_main_info_points {
        border-left: 9px solid #eaf9e3;
        margin-top: 7px;
        padding-bottom: 9px;
        padding-left: 50px;
        padding-top: 9px;

        & li {
          font-size: 16px;
          position: relative;

          &::before {
            content: url('/gastable/contents/img/compare_shared/list_circle.png');
            height: 30px;
            left: -38px;
            position: absolute;
            top: -4px;
            transform: scale(0.8);
            width: 30px;
          }

          & + li {
            margin-top: 10px;
          }
        }

        &.un_sharedGasT_compare_seriesSummary_main_info_points__disadvantage {
          border-left: 9px solid #dbf3fd;

          & li {
            &::before {
              content: url('/gastable/contents/img/compare_shared/list_cross.png');
            }
          }
        }

        + .un_sharedGasT_compare_seriesSummary_main_info_points {
          margin-top: 15px;
        }
      }
    }

    .un_sharedGasT_compare_seriesSummary_main_imgPc {
      margin-top: 40px;
    }

    + .un_sharedGasT_compare_seriesSummary_comment {
      margin-top: 40px;
    }
  }

  .un_sharedGasT_compare_seriesSummary_comment {
    padding-left: 10px;
    position: relative;

    .un_sharedGasT_compare_seriesSummary_comment_icon {
      left: 0;
      position: absolute;
      top: -35px;

      & img {
        height: auto;
        width: 110px;
      }
    }

    .un_sharedGasT_compare_seriesSummary_comment_txt {
      border: 1px solid var(--defaultTxtColor);
      border-radius: 10px;
      font-size: 17px;
      font-weight: bold;
      padding: 35px 20px 20px 30px;
    }

    + .un_sharedGasT_compare_seriesSummary_btn_wrapper {
      margin-top: 20px;
    }
  }

  .un_sharedGasT_compare_seriesSummary_btn_wrapper {
    margin: 0 0 0 auto;
    width: 50%;

    .un_sharedGasT_compare_seriesSummary_btn,
    .un_sharedGasT_compare_seriesSummary_btn:link,
    .un_sharedGasT_compare_seriesSummary_btn:visited {
      background-color: #38a505;
      border-radius: 3px;
      box-sizing: border-box;
      color: #fff;
      display: inline-block;
      font-size: 15px;
      font-weight: bold;
      padding: 10px;
      text-align: center;
      text-decoration: none;
      width: 100%;
    }

    .un_sharedGasT_compare_seriesSummary_btn::after {
      content: "\020\03e";
      white-space: pre;
    }
  }

  + .un_sharedGasT_hdg3 {
    margin-top: 60px;
  }
}


/* オプションプレゼント案内テキスト */
.un_sharedGasT_compare_table_wrapper + .un_sharedGasT_compare_optionInfo {
  margin-top: 45px;
}
.un_sharedGasT_compare_optionInfo {
  text-align: center;
  
  .un_sharedGasT_compare_optionInfo_txt {
    display: inline-block;
    font-weight: bold;
    position: relative;

    &::before, &::after {
      position: absolute;
      top: -10px;
      transform: scale(0.6);
    }

    &::before {
      content: url('/gastable/contents/img/compare_shared/option_decoration_left.png');
      left: -60px;
    }
    
    &::after {
      content: url('/gastable/contents/img/compare_shared/option_decoration_right.png');
      right: -60px;
    }
  }

  + .bl_panel.bl_panel__noBorder:not(.bl_panel__noPadding) {
    margin-top: 5px;
  }
}


/* モーダル */
.un_sharedGasT_compare_modal {
  width: 700px;

  .un_sharedGasT_compare_modal_ttl {
    align-items: center;
    display: flex;
    justify-content: space-between;

    .un_sharedGasT_compare_modal_ttl_inner {
      display: flex;
      align-items: center;
      font-weight: bold;
    }

    .un_sharedGasT_compare_modal_ttl_inner small {
      margin-left: 10px;
      line-height: 8px;
    }

    .un_sharedGasT_compare_modal_ttl_inner img:nth-child(2) {
      margin-left: 20px;
    }

    .un_sharedGasT_compare_modal_ttl_color {
      padding: 2px 50px;
      border-radius: 5px;
      color: #fff;
      background-color: var(--dekiruGreen);
    }
  }

  .un_sharedGasT_hdg4 + .un_sharedGasT_compare_modal_cardUnit {
    margin-top: 10px;
  }

  /* 通常仕様（3カラム用） */
  .un_sharedGasT_compare_modal_cardUnit {
    display: flex;
    flex-wrap: wrap;
    gap: 30px 10px;

    .un_sharedGasT_compare_modal_card {
      align-items: center;
      display: flex;
      flex-direction: column;
      width: calc((100% - 20px) / 3);
    }

    .un_sharedGasT_compare_modal_card_img {
      max-width: 100%;
    }

    .un_sharedGasT_compare_modal_card_img img {
      height: auto;
      width: 100%;
    }

    .un_sharedGasT_compare_modal_card_img + .un_sharedGasT_compare_modal_card_ttl {
      margin-top: 10px;
    }

    .un_sharedGasT_compare_modal_card_ttl {
      font-size: 17px;
      font-weight: bold;
    }

    .un_sharedGasT_compare_modal_card_subTtl + .un_sharedGasT_compare_modal_card_typeItems {
      margin-top: 10px;
    }

    .un_sharedGasT_compare_modal_card_typeItems {
      align-items: center;
      display: flex;
      line-height: 1em;

      &:has(+.un_sharedGasT_compare_modal_card_typeItems),
      &+.un_sharedGasT_compare_modal_card_typeItems {
        margin-left: auto;
        margin-right: 0;
      }
    }

    .un_sharedGasT_compare_modal_card_typeItems_name + .un_sharedGasT_compare_modal_card_typeItems_cont {
      margin-left: 10px;
    }

    .un_sharedGasT_compare_modal_card_typeItems_cont {
      align-items: center;
      display: flex;
      gap: 5px;
    }

    .un_sharedGasT_compare_modal_card_typeItems_cont p {
      align-items: center;
      border: 1.5px solid #bfbfbf;
      box-sizing: border-box;
      display: flex;
      height: 25px;
      justify-content: center;
      line-height: 1.2em;
      width: 65px;
    }

    .un_sharedGasT_compare_modal_card_typeItems + .un_sharedGasT_compare_modal_card_typeItems {
      margin-top: 7px;
    }

    & + .bl_panel.bl_panel__noBorder.bl_panel__noPadding {
      margin-top: 40px;
    }
  }

  /* 1カラム用 */
  .un_sharedGasT_compare_modal_cardUnit.un_sharedGasT_compare_modal_cardUnit__col1 {
    .un_sharedGasT_compare_modal_card {
      width: 100%;
    }

    .un_sharedGasT_compare_modal_card_typeItems {
      justify-content: center;
      width: 37%;
    }

    .un_sharedGasT_compare_modal_card_typeItems:has(+.un_sharedGasT_compare_modal_card_typeItems),
    .un_sharedGasT_compare_modal_card_typeItems + .un_sharedGasT_compare_modal_card_typeItems {
      margin-left: 0;
    }
  }

  /* 2カラム用 */
  .un_sharedGasT_compare_modal_cardUnit.un_sharedGasT_compare_modal_cardUnit__col2 {
    justify-content: space-between;

    .un_sharedGasT_compare_modal_card {
      width: calc((100% - 20px) / 2);
    }
  }

}