@charset "utf-8";

.section_block {
  margin-top: 72px;
}

.mT8 {margin-top: 8px;}
.mT32 {margin-top: 32px;}

.benefits {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: 20px;
}
.benefits .benefits_card {
  min-width: 190px;
  padding: 12px;
  border: 1px solid #A66423;
  border-radius: 4px;
}
.benefits .benefits_card .ttl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  font-weight: bold;
  font-size: 1.4rem;
}
.benefits .benefits_card .num {
  font-weight: bold;
  font-size: 3.2rem;
  color: #D23A00;
}
.benefits .benefits_card .num span {
  font-weight: bold;
  font-size: 2.6rem;
}
.benefits .benefits_card .price {
  font-weight: bold;
  font-size: 1.4rem;
  color: #656565;
}
.benefits .benefits_card .price span {
  font-weight: 500;
  font-size: 1.2rem;
}
.benefits::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
      -ms-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 32px;
  height: 32px;
  background: url('/merit/point/au_hikari/img/icon_plus.svg') no-repeat;
  background-size: cover;
}

.annotation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.annotation span {
  min-width: 26px;
}

sup {
  top: -0.4em;
  font-size: 10px;
}

@media screen and (max-width:640px){
  .section_block { 
    margin-top: 56px; 
  }
  .cmn_w100p_wrap > .inner {
    padding: 40px 24px;
  }
  .benefits {
    gap: 14px;
  }
  .benefits .benefits_card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-flex: 1;
        -ms-flex: 1;
            flex: 1;
    min-width: unset;
    padding: 12px 10px;
  }
  .benefits::after {
    width: 24px;
    height: 24px;
  }
  .sp_mT32 {margin-top: 32px;}
}