@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Libre+Caslon+Text:ital@1&display=swap");

.intext-link,
.intext-link:hover {
  cursor: pointer;
  text-decoration: underline;
  color: inherit;
}

:root {
  --color-primary: #3279d5;
  --color-business: #51a75a;
  --color-private: #32427f;
}
.color-primary {
  color: var(--color-primary);
}
.color-business {
  color: var(--color-business);
}
.color-private {
  color: var(--color-private);
}

@media screen and (min-width: 641px) {
  .page-kv__card {
    padding-left: 0;
  }
}

/** PAGE INCENTIVE
==============================================*/
.page-incentive__title {
  text-align: center;
  font-weight: 900;
}
.page-incentive__title .deco-slash:before,
.page-incentive__title .deco-slash:after {
  background-color: #333;
}
@media screen and (min-width: 641px) {
}
@media screen and (max-width: 640px) {
  .page-incentive__title {
    font-size: var(--pixel16);
    margin-bottom: var(--pixel10);
  }
}

.incentive-banner {
  display: block;
  width: 100%;
  background-color: #0f1350;
  color: #fff;
}
.incentive-banner__lead {
  text-align: center;
  border-top: 1px solid;
  border-bottom: 1px solid;
  padding: var(--pixel10);
  margin-bottom: var(--pixel10);
}
.incentive-banner__main .main-lead {
  display: block;
  text-align: center;
  font-family: "YakuHanMP", "Noto Serif JP", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  font-weight: 700;
}
.incentive-banner__main .main-main {
  font-family: "YakuHanMP", "Noto Serif JP", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "ＭＳ Ｐ明朝", "MS PMincho", serif;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  background: -webkit-linear-gradient(357deg, #fbc926 0.48%, #f7e9aa 15.24%, #eed688 74.76%, #fffbcc 88.1%, #f9d968 99.52%);
  background: linear-gradient(93deg, #fbc926 0.48%, #f7e9aa 15.24%, #eed688 74.76%, #fffbcc 88.1%, #f9d968 99.52%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.incentive-banner__main .main-main .num {
  font-family: "Libre Caslon Text", serif;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: -0.05em;
  margin-right: 0.15em;
}
.incentive-banner__main .main-main .sub {
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.2;
}
.incentive-banner__period {
  display: block;
  text-align: center;
  margin-top: var(--pixel05);
}
.incentive-banner__period .period {
  display: inline-block;
  font-weight: 700;
  border: 1px solid;
  padding: var(--pixel03) var(--pixel25);
}
.incentive-banner__click {
  text-align: center;
  background: -webkit-linear-gradient(357deg, #fbc926 0.48%, #f7e9aa 15.24%, #eed688 74.76%, #fffbcc 88.1%, #f9d968 99.52%);
  background: linear-gradient(93deg, #fbc926 0.48%, #f7e9aa 15.24%, #eed688 74.76%, #fffbcc 88.1%, #f9d968 99.52%);
  color: #0f1350;
  font-weight: 700;
}
@media screen and (min-width: 641px) {
  .incentive-banner {
    position: relative;
  }
  .incentive-banner__info {
    padding: var(--pixel20) var(--pixel30);
  }
  .incentive-banner__lead {
    font-size: var(--pixel22);
  }
  .incentive-banner__main {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
  }
  .incentive-banner__main .main-lead {
    font-size: var(--pixel32);
  }
  .incentive-banner__main .main-main .num {
    font-size: var(--pixel80);
  }
  .incentive-banner__main .main-main .sub {
    font-size: var(--pixel40);
  }
  .incentive-banner__period .period {
    font-size: var(--pixel18);
  }
  .incentive-banner__click {
    font-size: var(--pixel16);
    position: absolute;
    right: 0;
    bottom: 0;
    padding: var(--pixel10) var(--pixel40);
  }
}
@media screen and (max-width: 640px) {
  .incentive-banner__lead {
    font-size: var(--pixel14);
  }
  .incentive-banner__info {
    padding: var(--pixel20) var(--pixel12);
  }
  .incentive-banner__main .main-lead {
    font-size: var(--pixel24);
  }
  .incentive-banner__main .main-main .num {
    font-size: var(--pixel64);
  }
  .incentive-banner__main .main-main .sub {
    font-size: var(--pixel22);
  }
  .incentive-banner__period .period {
    font-size: var(--pixel12);
  }
  .incentive-banner__click {
    font-size: var(--pixel14);
    padding: var(--pixel10);
  }
}

/** CAMPAIGN INFO
==============================================*/
.campaign-info__dl > dt {
  font-weight: 700;
  color: var(--color-primary);
  margin-bottom: var(--pixel10);
}
.campaign-info__dl > dt:not(:first-of-type) {
  margin-top: var(--pixel30);
}
@media screen and (min-width: 641px) {
  .campaign-info__dl > dt {
    font-size: var(--pixel18);
  }
}
@media screen and (max-width: 640px) {
  .campaign-info__dl > dt {
    font-size: var(--pixel13);
  }
}

.campaign-info__cut:not(:first-child) {
  margin-top: var(--pixel20);
}
.campaign-info__cut > *:not(:first-child) {
  margin-top: var(--pixel05);
}
@media screen and (min-width: 641px) {
  .campaign-info__txt {
    font-size: var(--pixel16);
  }
  .campaign-info__txt-small {
    font-size: var(--pixel14);
  }
  .campaign-info__dot > li {
    font-size: var(--pixel16);
  }
  .campaign-info__dot-small > li {
    font-size: var(--pixel14);
  }
  .campaign-info__notes > li {
    font-size: var(--pixel12);
  }
}
@media screen and (max-width: 640px) {
  .campaign-info__txt {
    font-size: var(--pixel11);
  }
  .campaign-info__txt-small {
    font-size: var(--pixel10);
  }
  .campaign-info__dot > li {
    font-size: var(--pixel11);
  }
  .campaign-info__dot-small > li {
    font-size: var(--pixel10);
  }
  .campaign-info__notes > li {
    font-size: var(--pixel10);
  }
}

.campaign-info__table {
  width: 100%;
  border-collapse: separate;
  border-spacing: var(--pixel02);
}
.campaign-info__table th,
.campaign-info__table td {
  text-align: center;
  vertical-align: middle;
  letter-spacing: 0.08em;
  padding: var(--pixel10) var(--pixel05);
  line-height: 1.5;
}
.campaign-info__table th {
  background-color: var(--color-primary);
  color: #fff;
  font-weight: 700;
}
.campaign-info__table td {
  background-color: #f2f2f2;
}
.campaign-info__bg {
  background-color: #f2f2f2;
  padding: var(--pixel15) var(--pixel20);
}
.campaign-info__img {
  display: block;
  width: 100%;
}
@media screen and (min-width: 641px) {
  .campaign-info__table th,
  .campaign-info__table td {
    font-size: var(--pixel14);
  }
}
@media screen and (max-width: 640px) {
  .campaign-info__table th,
  .campaign-info__table td {
    font-size: var(--pixel10);
  }
}

@media screen and (min-width: 641px) {
  .campaign-info__table--4row {
    width: 100%;
  }
}
@media screen and (max-width: 640px) {
  .campaign-info__table--4row {
    width: 798px;
  }
  .js-scrollable {
    cursor: -webkit-grab;
    cursor: grab;
    overflow-x: scroll;
    scrollbar-width: none;
  }
  .js-scrollable:active {
    cursor: -webkit-grabbing;
    cursor: grabbing;
  }
  .js-scrollable::-webkit-scrollbar {
    display: none;
  }

  .scroll-hint-icon {
    top: calc(50% - var(--pixel60));
    left: calc(50% - var(--pixel74));
    border-radius: var(--pixel06);
    padding: var(--pixel32) var(--pixel10) var(--pixel18);
  }
  .scroll-hint-icon {
    box-shadow: none;
    width: 39.46666666666667vw;
    height: 32vw;
  }
  .scroll-hint-icon:before {
    width: var(--pixel36);
    height: var(--pixel70);
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240%22%20height%3D%2273%22%20viewBox%3D%220%200%2040%2073%22%20fill%3D%22none%22%3E%20%3Cpath%20d%3D%22M8.74573%2041.471V5.78082C8.74573%203.50039%2010.5976%201.64856%2012.878%201.64856C15.1584%201.64856%2017.0103%203.50039%2017.0103%205.78082V28.4258C17.7631%2027.7994%2018.7247%2027.4257%2019.7798%2027.4257C21.758%2027.4257%2023.423%2028.7501%2023.945%2030.5634C24.7198%2029.8491%2025.7474%2029.404%2026.8848%2029.404C28.951%2029.404%2030.6764%2030.8492%2031.1105%2032.7834C31.8633%2032.1625%2032.8414%2031.8053%2033.9075%2031.8657C36.056%2031.9866%2037.7045%2033.8439%2037.7045%2035.998V49.6422C37.7045%2051.6259%2037.3968%2053.5986%2036.7979%2055.4889L33.9954%2064.3194V71.2706H10.0481V65.5338L2.39348%2051.3731C1.78353%2050.2411%201.53626%2048.9498%201.69561%2047.6749L2.76165%2039.0697C2.97595%2037.3278%203.9211%2035.7562%205.3608%2034.7561L7.69069%2033.1296%22%20stroke%3D%22%230F1350%22%20stroke-width%3D%223.29702%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  }
  .scroll-hint-icon:after {
    width: var(--pixel58);
    height: var(--pixel12);
    top: var(--pixel18);
    left: calc(50% - var(--pixel29));
    margin-left: 0;
    background-size: auto 100%;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20width%3D%2262%22%20height%3D%2215%22%20viewBox%3D%220%200%2062%2015%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1.64844%207.40186H58.5165%22%20stroke%3D%22%230F1350%22%20stroke-width%3D%223.29702%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3Cpath%20d%3D%22M49.6858%2013.1499L59.6483%207.4021L49.6858%201.6488%22%20stroke%3D%22%230F1350%22%20stroke-width%3D%223.29702%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
  }
}

/* METHOD OF EXCHANGE */
.method-of-exchange > dt {
  color: #fff;
  background-color: var(--color-primary);
  text-align: center;
  position: relative;
  cursor: pointer;
  font-weight: 700;
  margin-bottom: -1px;
  font-family: "YakuHanJP", "Noto Sans JP", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", Helvetica, Arial, Verdana, sans-serif;
  border-radius: var(--pixel08);
  padding: var(--pixel15);
}
.method-of-exchange > dt:before,
.method-of-exchange > dt:after {
  content: "";
  position: absolute;
  right: var(--pixel15);
  top: calc(50% - var(--pixel08));
  width: var(--pixel16);
  height: var(--pixel16);
}
.method-of-exchange > dt:before {
  background-color: #fff;
}
.method-of-exchange > dt:after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%2016%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3Bstroke%3A%23004084%3Bstroke-width%3A2px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M0%2C8h16%22%2F%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M8%2C0v16%22%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 70%;
}
.method-of-exchange > dt.is-active:after {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg%20id%3D%22_%E3%83%AC%E3%82%A4%E3%83%A4%E3%83%BC_1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2016%202%22%3E%3Cdefs%3E%3Cstyle%3E.cls-1%7Bfill%3Anone%3Bstroke%3A%23004084%3Bstroke-width%3A2px%3B%7D%3C%2Fstyle%3E%3C%2Fdefs%3E%3Cpath%20class%3D%22cls-1%22%20d%3D%22M0%2C1h16%22%2F%3E%3C%2Fsvg%3E");
}
.method-of-exchange > dt.is-active {
  border-bottom: 1px solid #f2f2f2;
  border-bottom-right-radius: 0;
  border-bottom-left-radius: 0;
}
.method-of-exchange > dd {
  padding: var(--pixel15) var(--pixel20);
}
@media screen and (min-width: 641px) {
  .method-of-exchange > dt {
    font-size: var(--pixel18);
  }
  .method-of-exchange > dd {
    padding: var(--pixel30) var(--pixel20);
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange > dt {
    font-size: var(--pixel14);
  }
  .method-of-exchange > dd {
    padding: var(--pixel15) var(--pixel20);
  }
}

.method-of-exchange__list {
  counter-reset: number;
}
.method-of-exchange__list > li:not(:last-child) {
  position: relative;
}
.method-of-exchange__list > li:not(:last-child):after {
  display: none;
}
@media screen and (min-width: 641px) {
  .method-of-exchange__list > li:not(:last-child) {
    margin-bottom: var(--pixel80);
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__list > li:not(:last-child) {
    margin-bottom: var(--pixel40);
  }
}

.method-of-exchange__item {
  padding-left: var(--pixel12);
}
.method-of-exchange__item:not(:first-child) {
  margin-top: var(--pixel35);
}

.method-of-exchange__info > *:not(:first-child) {
  margin-top: var(--pixel20);
}
.method-of-exchange__info {
  margin-bottom: var(--pixel20);
}
.method-of-exchange__item:first-of-type .method-of-exchange__info {
  position: relative;
}
.method-of-exchange__item:first-of-type .method-of-exchange__info:before {
  content: counter(number);
  counter-increment: number;
  background-color: var(--color-primary);
  color: #fff;
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
  line-height: 1;
  font-weight: 500;
  position: absolute;
  right: calc(100% + var(--pixel12));
  top: -0.1em;
  padding-left: 0.15em;
  width: var(--pixel20);
  height: var(--pixel20);
  font-size: var(--pixel13);
}
.method-of-exchange__txt {
  text-align: left !important;
}
.method-of-exchange__notes > li {
  padding-left: 1em;
  text-indent: -1em;
  text-align: left;
  font-size: var(--pixel12);
}
.method-of-exchange__notes > li:before {
  content: "※";
}
@media screen and (min-width: 641px) {
  .method-of-exchange__item:first-of-type .method-of-exchange__info:before {
    width: var(--pixel40);
    height: var(--pixel40);
    font-size: var(--pixel18);
  }
  .method-of-exchange__txt {
    font-size: var(--pixel16);
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__item:first-of-type .method-of-exchange__info:before {
    width: var(--pixel20);
    height: var(--pixel20);
    font-size: var(--pixel13);
  }
  .method-of-exchange__txt {
    font-size: var(--pixel11);
  }
}

.method-of-exchange__img {
  margin-right: auto;
  margin-left: auto;
  max-width: 100%;
}
.method-of-exchange__img img {
  width: 100%;
}
@media screen and (min-width: 641px) {
  .method-of-exchange__img {
    width: 282px;
  }
}
@media screen and (max-width: 640px) {
  .method-of-exchange__img {
    width: 75.2vw;
  }
}

.method-click {
  cursor: pointer;
  text-decoration: underline;
  color: #006fca;
}
