@charset "UTF-8";
@media print, screen and (min-width: 961px) {
  .mainArea .title img {
    width: 668px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .title img {
    width: clamp(0px, calc(0px + (534 * max(0px, ((100dvw - 0px) / (768))))), 534px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .l-keiopoint {
    margin-top: 20px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .l-keiopoint {
    margin-top: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .l-keiopoint img {
    width: 162px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .l-keiopoint img {
    width: clamp(0px, calc(0px + (170 * max(0px, ((100dvw - 0px) / (768))))), 170px);
  }
}
.mainArea > .l-inner {
  box-sizing: border-box;
  max-width: 980px;
  margin: 0 auto;
  padding: clamp(0px, calc(0px + (50 * max(0px, ((100dvw - 0px) / (768))))), 50px) clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px) clamp(0px, calc(0px + (80 * max(0px, ((100dvw - 0px) / (768))))), 80px);
}
.mainArea .section_text {
  font-weight: 700;
  letter-spacing: .1em;
  margin-top: 1em;
  line-height: 1.8;
  font-size: clamp(0px, calc(0px + (18 * max(0px, ((100dvw - 0px) / (600))))), 1.8rem);
}
.mainArea .section_button a,
.mainArea .make_button a,
.mainArea .attention_button a {
  color: #FFF;
  text-decoration: none;
  background-color: #0068B6;
  display: block;
  padding: .6em 2em .7em 1em;
  border-radius: 100em;
  box-sizing: border-box;
  position: relative;
  font-weight: 700;
  font-size: clamp(0px, calc(0px + (18 * max(0px, ((100dvw - 0px) / (600))))), 1.8rem);
  line-height: 1.4;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section_button a,
  .mainArea .make_button a,
  .mainArea .attention_button a {
    width: 356px;
    margin: 0 auto;
    letter-spacing: .05em;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section_button a,
  .mainArea .make_button a,
  .mainArea .attention_button a {
    width: clamp(0px, calc(0px + (500 * max(0px, ((100dvw - 0px) / (768))))), 500px);
    margin: 0 auto;
    letter-spacing: .05em;
  }
}
@media (hover: hover) and (pointer: fine) {
  .mainArea .section_button a span.c-hover-line,
  .mainArea .make_button a span.c-hover-line,
  .mainArea .attention_button a span.c-hover-line {
    background: linear-gradient(currentColor, currentColor) 0 100%/0% 1px no-repeat;
    transition: background 400ms cubic-bezier(0.165, 0.84, 0.44, 1);
    /* easeOutQuart */
    padding-bottom: 0.2em;
  }
  .mainArea .section_button a:hover span.c-hover-line,
  .mainArea .make_button a:hover span.c-hover-line,
  .mainArea .attention_button a:hover span.c-hover-line {
    background: linear-gradient(currentColor, currentColor) 0 100%/100% 1px no-repeat;
  }
}
.mainArea .section_button a::after,
.mainArea .make_button a::after,
.mainArea .attention_button a::after {
  display: block;
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-color: transparent transparent transparent #FFF;
  border-style: solid;
  border-width: .4em .7em;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section_button a::after,
  .mainArea .make_button a::after,
  .mainArea .attention_button a::after {
    right: .8em;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section_button a::after,
  .mainArea .make_button a::after,
  .mainArea .attention_button a::after {
    right: .5em;
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.about {
    margin-top: 82px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.about {
    margin-top: clamp(0px, calc(0px + (75 * max(0px, ((100dvw - 0px) / (768))))), 75px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.about .section_heading img {
    width: 980px;
  }
}
.mainArea .section.about .section_button {
  margin-top: clamp(0px, calc(0px + (32 * max(0px, ((100dvw - 0px) / (768))))), 32px);
}
.mainArea .section.exchange {
  margin-top: clamp(0px, calc(0px + (72 * max(0px, ((100dvw - 0px) / (768))))), 72px);
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .section_heading img {
    width: 980px;
  }
}
.mainArea .section.exchange .flow {
  background-color: #F2F7FB;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow {
    margin: 50px auto 0;
    border-radius: 15px;
    width: 920px;
    box-sizing: border-box;
    padding: 38px 30px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow {
    margin-top: clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    padding: clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px) clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px);
    border-radius: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .flow_heading img {
    width: 736px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .flow_heading img {
    width: clamp(0px, calc(0px + (544 * max(0px, ((100dvw - 0px) / (768))))), 544px);
  }
}
.mainArea .section.exchange .flow .passportcard {
  display: flex;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard {
    margin: 18px 0 22px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard {
    margin: clamp(0px, calc(0px + (18 * max(0px, ((100dvw - 0px) / (768))))), 18px) 0 clamp(0px, calc(0px + (22 * max(0px, ((100dvw - 0px) / (768))))), 22px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-yes {
    background: url("../images/image-pointgift_arrow-blue.svg") no-repeat 148px 100%;
    width: 233px;
    background-size: 15px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-yes {
    background: url("../images/image-pointgift_arrow-blue.svg") no-repeat clamp(0px, calc(0px + (73 * max(0px, ((100dvw - 0px) / (768))))), 73px) 100%;
    background-size: clamp(0px, calc(0px + (21 * max(0px, ((100dvw - 0px) / (768))))), 21px);
    width: clamp(0px, calc(0px + (122 * max(0px, ((100dvw - 0px) / (768))))), 122px);
  }
}
.mainArea .section.exchange .flow .passportcard .l-yes .l-answer {
  display: flex;
  height: 100%;
  align-items: center;
}
.mainArea .section.exchange .flow .passportcard .l-yes .l-answer img {
  height: clamp(0px, calc(0px + (42 * max(0px, ((100dvw - 0px) / (768))))), 42px);
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-yes .l-answer img {
    margin-left: 64px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-yes .l-answer img {
    margin-left: clamp(0px, calc(0px + (10 * max(0px, ((100dvw - 0px) / (768))))), 10px);
  }
}
.mainArea .section.exchange .flow .passportcard .l-no {
  position: relative;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no {
    width: 627px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no {
    width: 100%;
    max-width: 627px;
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .l-answer {
    background: url("../images/image-pointgift_arrow-pink.svg") no-repeat 300px 100%;
    background-size: 15px;
    padding: 20px 0;
    margin-bottom: 15px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .l-answer {
    background: url("../images/image-pointgift_arrow-pink.svg") no-repeat 50% 100%;
    background-size: clamp(0px, calc(0px + (22 * max(0px, ((100dvw - 0px) / (768))))), 22px);
    padding: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px) 0;
  }
}
.mainArea .section.exchange .flow .passportcard .l-no .l-answer img {
  height: clamp(0px, calc(0px + (42 * max(0px, ((100dvw - 0px) / (768))))), 42px);
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .l-answer img {
    margin-left: 90px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .l-answer img {
    margin-left: clamp(0px, calc(0px + (90 * max(0px, ((100dvw - 0px) / (768))))), 90px);
  }
}
.mainArea .section.exchange .flow .passportcard .l-no .make {
  background-color: #FFF;
  margin-top: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px);
}
.mainArea .section.exchange .flow .passportcard .l-no .make::after {
  content: "";
  width: 100%;
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make::after {
    background: url("../images/image-pointgift_arrow-blue.svg") no-repeat 300px 100%;
    height: 100px;
    background-size: 15px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make::after {
    background: url("../images/image-pointgift_arrow-blue.svg") no-repeat 50% 100%;
    background-size: clamp(0px, calc(0px + (22 * max(0px, ((100dvw - 0px) / (768))))), 22px);
    height: clamp(0px, calc(0px + (60 * max(0px, ((100dvw - 0px) / (768))))), 60px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make {
    padding: 2em 1em;
    margin-bottom: 124px;
    border-radius: 15px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make {
    padding: clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px) clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    border-radius: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
    margin-bottom: clamp(0px, calc(0px + (84 * max(0px, ((100dvw - 0px) / (768))))), 84px);
  }
}
.mainArea .section.exchange .flow .passportcard .l-no .make .make_text {
  font-weight: 700;
}
.mainArea .section.exchange .flow .passportcard .l-no .make .cards {
  display: flex;
  justify-content: space-between;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .cards {
    width: 514px;
    margin: 1.5em auto 0;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .cards {
    width: clamp(0px, calc(0px + (314 * max(0px, ((100dvw - 0px) / (768))))), 314px);
    margin: 1em auto 0;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .cards {
    flex-wrap: wrap;
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .cards img {
    width: 83px;
    height: auto;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .cards img {
    width: clamp(0px, calc(0px + (100 * max(0px, ((100dvw - 0px) / (768))))), 100px);
    height: auto;
    margin-bottom: clamp(0px, calc(0px + (12 * max(0px, ((100dvw - 0px) / (768))))), 12px);
  }
}
.mainArea .section.exchange .flow .passportcard .l-no .make .make_button {
  margin-top: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
}
.mainArea .section.exchange .flow .passportcard .l-no .make .make_button a {
  padding: 1.3em 1em 1.4em;
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .passportcard .l-no .make .make_button a {
    width: 100%;
  }
}
.mainArea .section.exchange .flow .passportcard .l-no .make .make_note {
  margin-top: .8em;
}
.mainArea .section.exchange .flow .flow_wrapper {
  background-color: #FFF;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .flow_wrapper {
    padding: 30px 36px 40px;
    border-radius: 15px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .flow_wrapper {
    padding: clamp(0px, calc(0px + (30 * max(0px, ((100dvw - 0px) / (768))))), 30px);
    border-radius: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
  }
}
.mainArea .section.exchange .flow .flow_wrapper li {
  border-bottom: 1px solid #808080;
  margin-bottom: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px);
  padding-bottom: clamp(0px, calc(0px + (60 * max(0px, ((100dvw - 0px) / (768))))), 60px);
}
.mainArea .section.exchange .flow .flow_wrapper li:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}
.mainArea .section.exchange .flow .flow_text {
  text-align: left;
  display: flex;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .flow_text {
    align-items: center;
  }
}
.mainArea .section.exchange .flow .flow_text img {
  margin-right: .8em;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .flow_text img {
    margin-top: 1em;
    align-self: center;
    vertical-align: middle;
    width: 60px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.exchange .flow .flow_text img {
    width: 2.5em;
  }
}
.mainArea .section.exchange .flow .flow_text span {
  font-weight: 700;
  line-height: 1.4;
}
.mainArea .section.exchange .flow .flow_text small {
  font-size: 70%;
}
.mainArea .section.exchange .flow .section_button {
  margin-top: clamp(0px, calc(0px + (32 * max(0px, ((100dvw - 0px) / (768))))), 32px);
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .section_button a {
    width: 400px;
  }
}
.mainArea .section.exchange .flow .flow_image {
  margin-top: 1em;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.exchange .flow .flow_image {
    text-align: right;
  }
}
.mainArea .section.exchange .flow .flow_image img {
  width: 100%;
  max-width: 722px;
}
.mainArea .section.exchange .flow .text_image {
  text-align: right;
  margin-top: 1.5em;
}
.mainArea .section.use {
  margin-top: clamp(0px, calc(0px + (96 * max(0px, ((100dvw - 0px) / (768))))), 96px);
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.use .section_heading img {
    width: 980px;
  }
}
.mainArea .section.use .section_text {
  background: url("../images/image-pointgift_use.svg") no-repeat 50% 100%;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.use .section_text {
    background-size: 920px;
    padding-bottom: 240px;
    margin-bottom: 2.5em;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.use .section_text {
    padding-bottom: clamp(0px, calc(0px + (180 * max(0px, ((100dvw - 0px) / (768))))), 180px);
    margin-bottom: 2em;
  }
}
.mainArea .section.use .section_text em {
  font-style: normal;
  font-size: 200%;
}
@media print, screen and (min-width: 961px) {
  .mainArea .section.use .section_button {
    margin-top: 16px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .section.use .section_button {
    margin-top: clamp(0px, calc(0px + (12 * max(0px, ((100dvw - 0px) / (768))))), 12px);
  }
}
.mainArea .attention {
  position: relative;
  width: 96%;
}
@media print, screen and (min-width: 961px) {
  .mainArea .attention {
    box-sizing: border-box;
    border-radius: 20px;
    border: 3px solid #0068B6;
    padding: 40px 38px;
    margin: 68px auto 0;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .attention {
    border: clamp(0px, calc(0px + (3 * max(0px, ((100dvw - 0px) / (768))))), 3px) solid #0068B6;
    margin: clamp(0px, calc(0px + (77 * max(0px, ((100dvw - 0px) / (768))))), 77px) auto 0;
    box-sizing: border-box;
    padding: clamp(0px, calc(0px + (40 * max(0px, ((100dvw - 0px) / (768))))), 40px) clamp(0px, calc(0px + (20 * max(0px, ((100dvw - 0px) / (768))))), 20px);
    border-radius: clamp(0px, calc(0px + (16 * max(0px, ((100dvw - 0px) / (768))))), 16px);
  }
}
@media print, screen and (min-width: 961px) {
  .mainArea .attention .attention_heading img {
    width: 536px;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .attention .attention_heading img {
    width: clamp(0px, calc(0px + (402 * max(0px, ((100dvw - 0px) / (768))))), 402px);
  }
}
.mainArea .attention .attention_text {
  text-align: justify;
  text-justify: inter-ideograph;
}
@media print, screen and (min-width: 961px) {
  .mainArea .attention .attention_text {
    margin-top: 2em;
  }
}
@media screen and (max-width: 960.98px) {
  .mainArea .attention .attention_text {
    margin-top: 1.5em;
  }
}
.mainArea .attention ul {
  text-align: justify;
  text-justify: inter-ideograph;
  margin-top: 1.5em;
}
.mainArea .attention ul li {
  margin-top: .2em;
  padding-left: 1em;
  text-indent: -1em;
}
.mainArea .attention ul li::before {
  content: "◯";
}
.mainArea .attention .attention_button {
  margin-top: clamp(0px, calc(0px + (32 * max(0px, ((100dvw - 0px) / (768))))), 32px);
}

/*# sourceMappingURL=pointgift.css.map */