/* ==== */
/* page */
/* ==== */
:root {
  --w-btn-entry-pc: 400px;
  --w-btn-entry-sp: 253px;
  --w-triangle-flow-e-receipt: 29px;
  --h-triangle-flow-e-receipt: 36px;
  --m-triangle: 24px;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: "Open Sans", "Noto Sans JP", Hiragino Sans, "ヒラギノ角ゴ Pro",
    "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", sans-serif;
  min-width: 320px;
  line-height: 1.5;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.87);
}

/* ===== */
/* reset */
/* ===== */
summary {
  display: block;
  position: relative;
  cursor: pointer;
}

summary::-webkit-details-marker {
  display: none;
}

p {
  margin: 0;
}

/* ========== */
/* typography */
/* ========== */
a {
  text-decoration: none;
}

h1,
h2,
h3 {
  font-weight: 700;
  margin: 0;
}

.bold {
  font-weight: 700;
}

.hover-underline:hover {
  text-decoration-line: underline;
}

.wb-keep_all {
  word-break: keep-all;
}

/* ===== */
/* atoms */
/* ===== */
.btn-scroll_to_top {
  position: absolute;
  right: 16px;
  bottom: 18px;
}

.need_entry::before {
  content: "";
  display: inline-block;
  border: 1px solid #20aee5;
  transform: matrix(0.4, 0.9, 0.9, -0.4, 0, 0);
  width: 21px;
}

.need_entry::after {
  content: "";
  display: inline-block;
  border: 1px solid #20aee5;
  transform: matrix(-0.4, 0.9, -0.9, -0.4, 0, 0);
  width: 21px;
}

.list-row {
  margin: 0;
  padding: 0;
}

.list-row > li {
  list-style: none;
}

.list-row > li:not(:first-child)::before {
  content: "";
  height: 18px;
  margin-left: 8px;
  margin-right: 8px;
  border-left: 1px solid #e1e6ee;
}

.list-custom {
  padding-left: 1em;
  margin: 0;
}

.list-ref_mark > li {
  padding-left: 2px;
}

.list-ref_mark > li::marker {
  content: "※";
}

.list-bullet > li::marker {
  content: "・";
}

.list-blk_c > li::marker {
  content: "●";
}

.list-disc > li {
  position: relative;
  list-style: none;
}

.list-disc > li::before {
  content: "";
  display: block;
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.87);
  left: -10px;
  top: 8px;
}

.btn {
  display: inline-block;
  width: max-content;
}

.btn-e_receipt {
  border: 1px solid #20aee5;
  border-radius: 40px;
  padding: 14px 24px;
}

.btn-entry {
  width: var(--w-btn-entry-pc);
  border-radius: 50px;
  padding: 15px 0;
}

.balloon {
  position: relative;
  display: inline-block;
  margin-bottom: 20px;
  border-radius: 46px;
}

.balloon::before {
  content: "";
  position: absolute;
  top: 95%;
  left: 50%;
  margin-left: -10px;
  border: 10px solid transparent;
  border-top: 10px solid #20aee5;
  border-radius: 1px;
}

.m-balloon-content {
  margin: 0 44px 3px;
}

.list-entry-note {
  width: 100%;
  max-width: 400px;
  padding: 12px 16px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 10px;
}

.mv_entry {
  position: absolute;
  bottom: 38px;
  left: calc(50% - var(--w-btn-entry-pc) / 2);
}

/* ========= */
/* molecules */
/* ========= */

/* summaryタグ内の開閉アイコン */
.summary_icon {
  position: absolute;
  right: 0;
}

/* details 開閉に伴う表示切り替え */

.hidden_when_open {
  display: block;
}

.hidden_when_closed {
  display: none;
}

details[open] .hidden_when_open {
  display: none;
}

details[open] .hidden_when_closed {
  display: block;
}

/* 対象店舗一覧 */
.shops_summary {
  padding: 32px 0;
}

.shops_summary_text {
  justify-content: center;
}

.shops_summary_icon {
  top: calc(50% - 8px);
}

.shop_info {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
}

.shop_info:not(:last-child) {
  margin-bottom: 8px;
}

.shop_row {
  padding: 24px 0;
}

/* FAQ */
.faq_summary {
  padding: 16px 0;
}

.faq_summary_icon {
  top: calc(50% - 7px);
}

.faq_summary_icon > img {
  width: 14px;
  height: 14px;
}

.faq_list_icon {
  margin-right: 8px;
}

.faq_answer_body > :last-child {
  margin: 0;
}

.faq_answer_body > :not(:last-child) {
  margin: 0 0 1em;
}

.mr-faq_content {
  margin-right: 21px;
}

/* ========= */
/* organisms */
/* ========= */

.flow > :not(:first-child)::before {
  content: "";
  display: block;
  background: no-repeat url("https://cdn.airregi.jp/top/ereceipt/campaign0424/ptb20230424/img/icon/triangle_right.svg?v=80d7166");
  background-size: contain;
}

.steps > :not(:first-child)::before {
  height: 40px;
  width: 32px;
  margin: var(--m-triangle) auto;
  transform: rotate(90deg);
}

.flow_e_receipt > :not(:first-child) {
  position: relative;
  margin-left: calc(var(--m-triangle) * 2 + var(--w-triangle-flow-e-receipt));
}

.flow_e_receipt > :not(:first-child)::before {
  position: absolute;
  left: calc(var(--m-triangle) * -1 - var(--w-triangle-flow-e-receipt));
  top: 259px;
  height: var(--h-triangle-flow-e-receipt);
  width: var(--w-triangle-flow-e-receipt);
}

.flow_e_receipt_modal > :not(:first-child) {
  margin-left: 0;
}

.flow_e_receipt_modal > :not(:first-child)::before {
  height: var(--h-triangle-flow-e-receipt);
  width: var(--w-triangle-flow-e-receipt);
  margin-top: 20px;
  margin-bottom: 20px;
  transform: rotate(90deg);
}

.w-about_e_receipt-text {
  width: 300px;
}

/* modal */
#modal {
  position: fixed;
  top: 0;
  width: 100%;
}

#modal_hidden_chk {
  display: none;
}

#modal_hidden_chk:checked + #modal {
  display: none;
}

/* ====== */
/* common */
/* ====== */

/* display */
.flex {
  display: flex;
}

.grid {
  display: grid;
}

.block {
  display: block;
}

.i-block {
  display: inline-block;
}

.hidden {
  display: none;
}

.shown_sp {
  display: none;
}

.shown_768 {
  display: none;
}

.shown_375 {
  display: none;
}

/* flex */
.fd-column {
  flex-direction: column;
}

.f-wrap {
  flex-wrap: wrap;
}

.f-wrap_r {
  flex-wrap: wrap-reverse;
}

.ai-start {
  align-items: start;
}

.ai-center {
  align-items: center;
}

.ai-end {
  align-items: end;
}

.jc-sb {
  justify-content: space-between;
}

.jc-center {
  justify-content: center;
}

/* grid */
.col-3_2 {
  grid-template-columns: repeat(3, auto);
}

/* alignment */
.ta-center {
  text-align: center;
}

/* position */
.relative {
  position: relative;
}

/* sizing */
.bs-border_box {
  box-sizing: border-box;
}

/* width */
.w-auto {
  width: auto;
}

.w-100 {
  width: 100%;
}

.w-mc_100 {
  width: max-content;
}

.w-168 {
  width: 168px;
}

.mw-705 {
  max-width: 705px;
}

.mw-343 {
  max-width: 343;
}

/* height */
.mh-160 {
  min-height: 160px;
}

.h-40 {
  height: 40px;
}

.h-48_31 {
  height: 48px;
}

.h-42_28 {
  height: 42px;
}

.h-100 {
  height: 100%;
}

/* overflow */
.oy-scroll {
  overflow-y: scroll;
}

.ow-anywhere {
  overflow-wrap: anywhere;
}

/* gap */
.cg-60_40 {
  column-gap: 60px;
}

.rg-24_20 {
  row-gap: 24px;
}

/* margin */
.mt-104 {
  margin-top: 104px;
}

.mt-104_56 {
  margin-top: 104px;
}

.mt-72_56 {
  margin-top: 72px;
}

.mt-72_24 {
  margin-top: 72px;
}

.mt-56_35 {
  margin-top: 56px;
}

.mr-50_0 {
  margin-right: 50px;
}

.mt-38_33 {
  margin-top: 38px;
}

.mt-38 {
  margin-top: 38px;
}

.mt-34 {
  margin-top: 34px;
}

.mt-23_13 {
  margin-top: 23px;
}

.mx-32_16 {
  margin-left: 32px;
  margin-right: 32px;
}

.mt-32_24 {
  margin-top: 32px;
}

.mt-32 {
  margin-top: 32px;
}

.mt-24 {
  margin-top: 24px;
}

.ml-24_0 {
  margin-left: 24px;
}

.mt-24_16 {
  margin-top: 24px;
}

.mt-24_8 {
  margin-top: 24px;
}

.mt-16 {
  margin-top: 16px;
}

.mr-16 {
  margin-right: 16px;
}

.mt-12_16 {
  margin-top: 12px;
}

.mt-12 {
  margin-top: 12px;
}

.mt-8 {
  margin-top: 8px;
}

.mr-8 {
  margin-right: 8px;
}

.mb-8 {
  margin-bottom: 8px;
}

.ml-6 {
  margin-left: 6px;
}

.mr-4 {
  margin-right: 4px;
}

.mt-2_0 {
  margin-top: 2px;
}

/* padding */
.pb-40_88 {
  padding-bottom: 40px;
}

.py-40_32 {
  padding-top: 40px;
  padding-bottom: 40px;
}

.pt-40_32 {
  padding-top: 40px;
}

.px-335 {
  padding-left: 33.5px;
  padding-right: 33.5px;
}

.px-32_16 {
  padding-left: 32px;
  padding-right: 32px;
}

.py-32 {
  padding-top: 32px;
  padding-bottom: 32px;
}

.px-24 {
  padding-left: 24px;
  padding-right: 24px;
}

.py-24 {
  padding-top: 24px;
  padding-bottom: 24px;
}

.px-22_16 {
  padding-left: 22px;
  padding-right: 22px;
}

.p-16 {
  padding: 16px;
}

.py-16_12 {
  padding-top: 16px;
  padding-bottom: 16px;
}

.px-16 {
  padding-left: 16px;
  padding-right: 16px;
}

.pb-16 {
  padding-bottom: 16px;
}

.pt-16_0 {
  padding-top: 16px;
}

.py-14_8 {
  padding-top: 14px;
  padding-bottom: 14px;
}

/* background */
.bg-air_blue {
  background: #20aee5;
}

.bg-38 {
  background: rgba(0, 0, 0, 0.38);
}

.bg-azureish_white {
  background: #e1f0f8;
}

.bg-air_secondary {
  background: #e5f4ff;
}

.bg-footer {
  background: #f3f5fa;
}

.bg-cc {
  background: #cccccc;
}

.bg-f5 {
  background: #f5f5f5;
}

.bg-ff {
  background: #ffffff;
}

.bg-mv {
  position: relative;
  background: url("https://cdn.airregi.jp/top/ereceipt/campaign0424/ptb20230424/img/mv/pc_1000pt.png?v=f7795a4"),
    repeating-linear-gradient(
      135deg,
      #fdda55,
      #fdda55 10px,
      #fbcc45 10px,
      #fbcc45 20px
    );
  background-size: auto 558px;
  background-position: top;
  background-repeat: no-repeat;
  height: 496px;
}

/* border */
.by-012 {
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

.bt-012 {
  border-top: 2px solid rgba(0, 0, 0, 0.12);
}

.bb-012 {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

/* border-radius */
.br-15 {
  border-radius: 15px;
}

.br-top-15 {
  border-radius: 15px 15px 0 0;
}

.br-bottom-15 {
  border-radius: 0 0 15px 15px;
}

/* font-colors */
.color-air_blue {
  color: #20aee5;
}

.color-function_link {
  color: #0892c7;
}

.color-55 {
  color: #555555;
}

.color-f9 {
  color: #f9f9f9;
}

.color-ff {
  color: #ffffff;
}

.color-06 {
  color: rgba(0, 0, 0, 0.6);
}

.color-footer {
  color: #516570;
}

/* font-size */
.fs-32_28 {
  font-size: 32px;
}

.fs-24_20 {
  font-size: 24px;
}

.fs-24_16 {
  font-size: 24px;
}

.fs-20_16 {
  font-size: 20px;
}

.fs-20_14 {
  font-size: 20px;
}

.fs-16 {
  font-size: 16px;
}

.fs-16_14 {
  font-size: 16px;
}

.fs-16_12 {
  font-size: 16px;
}

.fs-12 {
  font-size: 12px;
}

.fs-12_14 {
  font-size: 12px;
}

.fs-12_10 {
  font-size: 12px;
}

.fs-9 {
  font-size: 9px;
}

/* cursor */
.cursor-pointer {
  cursor: pointer;
}

/* ======== */
/* Pad / SP */
/* ======== */
@media screen and (max-width: 768px) {
  /* ===== */
  /* atoms */
  /* ===== */
  .btn-entry {
    width: var(--w-btn-entry-sp);
    border-radius: 40px;
    padding: 14px 0;
  }

  .balloon {
    margin-bottom: 14px;
    border-radius: 32px;
  }

  .balloon::before {
    margin-left: -7px;
    border: 7px solid transparent;
    border-top: 7px solid #20aee5;
  }

  .m-balloon-content {
    margin-left: 16px;
    margin-right: 16px;
  }

  .size-arrow_steps {
    height: 36px;
    width: auto;
  }

  .mv_entry {
    bottom: 32px;
    left: calc(50% - var(--w-btn-entry-sp) / 2);
  }

  /* --------- */
  /* molecules */
  /* --------- */

  /* 対象店舗一覧 */
  .shops_summary {
    padding: 16px 0;
  }

  .shops_summary_text {
    justify-content: start;
  }

  .shop_info:not(:last-child) {
    margin-bottom: 4px;
  }

  .shop_row {
    padding-top: 19px;
    padding-bottom: 16px;
  }

  /* ========= */
  /* organisms */
  /* ========= */

  .steps > :not(:first-child)::before {
    height: 36px;
    width: 28.8px;
  }

  .w-about_e_receipt-text {
    width: 100%;
  }

  /* ====== */
  /* common */
  /* ====== */

  /* background */
  .bg-mv {
    background: url("https://cdn.airregi.jp/top/ereceipt/campaign0424/ptb20230424/img/mv/sp_1000pt.png?v=a413b8b"),
      repeating-linear-gradient(
        135deg,
        #fdda55,
        #fdda55 10px,
        #fbcc45 10px,
        #fbcc45 20px
      );
    background-position: top;
    background-repeat: no-repeat;
    background-size: auto 444px, auto;
    height: 534px;
  }

  /* display */
  .shown_pc {
    display: none;
  }

  .shown_sp {
    display: block;
  }

  .shown_768 {
    display: block;
  }

  /* grid */
  .col-3_2 {
    grid-template-columns: repeat(2, auto);
  }

  /* height */
  .h-48_31 {
    height: 31px;
  }

  .h-42_28 {
    height: 28px;
  }

  /* width */
  .w-mc_100 {
    width: 100%;
  }

  /* gap */
  .cg-60_40 {
    column-gap: 40px;
  }

  .rg-24_20 {
    row-gap: 24px;
  }

  /* margin */
  .mt-104_56 {
    margin-top: 56px;
  }

  .mt-72_56 {
    margin-top: 56px;
  }

  .mt-72_24 {
    margin-top: 24px;
  }

  .mt-56_35 {
    margin-top: 35px;
  }

  .mr-50_0 {
    margin-right: 0;
  }

  .mt-38_33 {
    margin-top: 33px;
  }

  .mt-23_13 {
    margin-top: 13px;
  }

  .mt-32_24 {
    margin-top: 24px;
  }

  .mx-32_16 {
    margin-left: 16px;
    margin-right: 16px;
  }

  .mt-24_16 {
    margin-top: 16px;
  }

  .mt-24_8 {
    margin-top: 8px;
  }

  .ml-24_0 {
    margin-left: 0px;
  }

  .mt-12_16 {
    margin-top: 16px;
  }

  .mt-2_0 {
    margin-top: 0px;
  }

  /* padding */
  .pb-40_88 {
    padding-bottom: 88px;
  }

  .py-40_32 {
    padding-top: 32px;
    padding-bottom: 32px;
  }

  .pt-40_32 {
    padding-top: 32px;
  }

  .px-32_16 {
    padding-left: 16px;
    padding-right: 16px;
  }

  .px-22_16 {
    padding-left: 16px;
    padding-right: 16px;
  }

  .py-16_12 {
    padding-top: 12px;
    padding-bottom: 12px;
  }

  .pt-16_0 {
    padding-top: 0;
  }

  .py-14_8 {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  /* font-size */
  .fs-32_28 {
    font-size: 28px;
  }

  .fs-24_20 {
    font-size: 20px;
  }

  .fs-24_16 {
    font-size: 16px;
  }

  .fs-20_16 {
    font-size: 16px;
  }

  .fs-20_14 {
    font-size: 14px;
  }

  .fs-16_14 {
    font-size: 14px;
  }

  .fs-16_12 {
    font-size: 12px;
  }

  .fs-12 {
    font-size: 12px;
  }

  .fs-12_10 {
    font-size: 10px;
  }

  .fs-9 {
    font-size: 9px;
  }
}

@media screen and (max-width: 600px) {
  /* フッタ折り返し変化 */
  .footer_list {
    width: 100%;
  }

  .footer_list > li {
    flex-grow: 1;
    margin-bottom: 24px;
  }

  .footer_list > li::before {
    display: none;
  }

  .footer_list > li:not(:last-child) {
    margin-right: 16px;
  }

  .mb-0_16 {
    margin-bottom: 16px;
  }

  .fs-12_14 {
    font-size: 14px;
  }
}

@media screen and (max-width: 500px) {
  /* 500pxから画像サイズ変化 */
  .shown_768 {
    display: none;
  }

  .shown_375 {
    display: block;
  }
}
