a:hover {
  cursor: pointer;
  opacity: 0.85;
  transition: 0.2s;
}
.notification-area {
  font-size: 12px;
  font-weight: 400;
  text-align: left;
  padding: 16px;
  margin: 8px 0 0;
  color: #3f3f3f;
  background: rgba(0,0,0,0.04);
}
@media screen and (min-width: 560px) {
  .notification-area {
    font-size: 14px;
    padding: 24px;
    margin: 8px 0;
  }
}
.notification-area .red {
  color: #f00;
}
.notification-area ul {
  padding-left: 1em;
}
.notification-area ul li {
  list-style: disc;
}
.period-section {
  background: #f3ffcc;
  color: #378a00;
}
@media screen and (min-width: 560px) {
  .period-section {
    padding: 24px 24px 18px;
  }
}
.period-title {
  background: #378a00;
  border: none;
  line-height: 1.8;
  border-radius: 80px;
}
@media screen and (min-width: 560px) {
  .period-title {
    font-size: 3.5vw;
    padding: 2px 22px;
    margin-bottom: 0;
  }
}
@media screen and (min-width: 740px) {
  .period-title {
    font-size: 26px;
    padding: 2px 22px;
    margin-bottom: 4px;
  }
}
@media screen and (max-width: 740px) {
  .period-date {
    font-size: 3.7vw;
    line-height: 1.5;
    padding-top: 8px;
  }
}
@media screen and (min-width: 740px) {
  .period-date {
    font-size: 28px;
    padding-top: 0;
    line-height: 1.5;
  }
}
@media screen and (max-width: 740px) {
  .period-date .em {
    font-size: 6vw;
  }
}
@media screen and (min-width: 740px) {
  .period-date .em {
    font-size: 44px;
  }
}
@media screen and (max-width: 740px) {
  .period-date-pending {
    font-size: 3.2vw;
    line-height: 1.5;
    margin: -8px 0;
  }
}
@media screen and (min-width: 560px) {
  .period-date-pending {
    font-size: 18px;
    line-height: 1.5;
    margin: -8px -8px -2px;
  }
}
.period-end-message {
  margin-top: 8px;
  color: #000;
}
.push-app-block {
  background: #fff;
  padding: 24px 4.27vw 28px;
}
@media screen and (min-width: 560px) {
  .push-app-block {
    padding: 32px 16px 36px;
  }
}
.push-app-text {
  font-size: 3.73vw;
  margin: 0 0 16px;
}
@media screen and (min-width: 560px) {
  .push-app-text {
    font-size: 22px;
  }
}
.update-text {
  font-size: 12px;
  margin: 8px 0 0;
  color: #000;
}
@media screen and (min-width: 560px) {
  .update-text {
    margin: 16px 0 0;
    font-size: 14px;
  }
}
.push-app-btn {
  width: 100%;
  background: #f04;
  border-radius: 14px;
  box-shadow: none;
  border-bottom: 4px solid #950028;
  text-shadow: none;
  max-width: 500px;
  text-align: center;
}
@media screen and (min-width: 560px) {
  .push-app-btn {
    font-size: 28px;
    padding: 22px 1em;
  }
}
.push-app-btn:after {
  background: none;
}
.push-app-btn:hover {
  border-bottom: 1px solid #f04;
  margin-top: 3px;
  transition: 0.2s;
}
.push-app-btn span {
  margin: 0 auto;
}
.news-about {
  padding: 24px 3vw 24px 4.27vw;
  background: #ffffa3;
}
@media screen and (min-width: 560px) {
  .news-about {
    padding: 40px 16px;
  }
}
.news-about-title {
  max-width: 560px;
  margin: 0 auto;
}
.news-about-inner {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: 4.27vw;
  margin: 16px auto 0;
  max-width: 560px;
}
@media screen and (min-width: 560px) {
  .news-about-inner {
    gap: 32px;
    margin: 32px auto 0;
  }
}
.news-about-inner img {
  width: 36.15vw;
  height: auto;
  max-width: 180px;
}
.news-about-text {
  margin-top: 8px;
  text-align: left;
  font-weight: bold;
  font-size: 3.47vw;
  line-height: 1.6;
}
@media screen and (min-width: 560px) {
  .news-about-text {
    font-size: 20px;
  }
}
.news-about-btn {
  margin-top: 12px;
  margin-right: 2.13vw;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.6vw;
  background: #f80;
  color: #fff;
  text-decoration: none;
  border-radius: 8px;
  font-size: 3.2vw;
  gap: 4px;
}
@media screen and (min-width: 560px) {
  .news-about-btn {
    font-size: 16px;
    margin-right: 0;
    padding: 0;
    height: 48px;
  }
}
.news-about-btn img {
  width: 3.2vw;
}
@media screen and (min-width: 560px) {
  .news-about-btn img {
    display: none;
  }
}
.campaign-overview {
  padding: 24px 4.27vw 32px;
  background: #7ccef7;
}
@media screen and (min-width: 560px) {
  .campaign-overview {
    padding: 40px 16px;
  }
}
.campaign-overview-title {
  max-width: 560px;
  margin: 0 auto;
}
.campaign-overview-point {
  padding: 24px 4.27vw 16px;
  text-align: left;
}
@media screen and (min-width: 560px) {
  .campaign-overview-point {
    padding: 16px;
    max-width: 460px;
    margin: 0 auto;
  }
}
.overview-point {
  margin-bottom: 8px;
  display: inline-flex;
  gap: 8px;
  font-size: 3.73vw;
  font-weight: bold;
}
@media screen and (min-width: 560px) {
  .overview-point {
    font-size: 20px;
  }
}
.overview-point img {
  width: 4.8vw;
}
@media screen and (min-width: 560px) {
  .overview-point img {
    width: 24px;
  }
}
.overview-point a {
  color: #c03;
}
.campaign-overview-get {
  max-width: 560px;
  margin: 0 auto;
}
.overview-get-title {
  margin: 8px auto 16px;
}
.slant-bg {
  padding: 0;
}
.contents-innerblock {
  width: calc(100% - 8.54vw);
  margin: 32px 4.27vw;
  padding: 1em 4.27vw 0;
  text-shadow: none;
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  border: none;
  border-radius: 12px;
  font-size: 3.73vw;
}
@media screen and (min-width: 560px) {
  .contents-innerblock {
    font-size: 20px;
    width: calc(100% - 80px);
    margin: 56px 40px;
    padding: 1.5em 28px 0;
  }
}
@media screen and (min-width: 740px) {
  .contents-innerblock {
    width: calc(100% - 160px);
    margin: 80px;
    padding: 1.5em 56px 0;
  }
}
.contents-innerblock h3.no-ribon {
  top: 0;
  margin: 10px -6.93vw 0;
  height: auto;
}
@media screen and (min-width: 560px) {
  .contents-innerblock h3.no-ribon {
    margin: 10px -50px 0;
  }
}
@media screen and (min-width: 740px) {
  .contents-innerblock h3.no-ribon {
    margin: 10px -78px 0;
  }
}
.contents-innerblock h3.no-ribon:before,
.contents-innerblock h3.no-ribon:after {
  bottom: -2.67vw;
  border-top: 2.67vw solid #cb8c2d;
  border-left: 2.67vw solid transparent;
}
@media screen and (min-width: 560px) {
  .contents-innerblock h3.no-ribon:before,
  .contents-innerblock h3.no-ribon:after {
    bottom: -22px;
    border-top: 22px solid #cb8c2d;
    border-left: 22px solid transparent;
  }
}
.contents-innerblock h3.no-ribon:after {
  border-left: none;
  border-right: 2.67vw solid transparent !important;
}
@media screen and (min-width: 560px) {
  .contents-innerblock h3.no-ribon:after {
    border-right: 22px solid transparent !important;
  }
}
.contents-innerblock h3.no-ribon span {
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: none;
  font-size: 5.33vw;
  line-height: 1.3;
  height: auto;
  min-height: 34px;
}
@media screen and (min-width: 560px) {
  .contents-innerblock h3.no-ribon span {
    font-size: 28px;
    min-height: 76px;
  }
}
.contents-innerblock h3.no-ribon hr {
  background: #dbdbdb;
}
.pink h3.no-ribon:before {
  border-top-color: #c61282;
}
.pink h3.no-ribon:after {
  border-right-color: #c61282;
}
.step-contents {
  padding: 32px 0;
}
@media screen and (min-width: 560px) {
  .step-contents {
    padding: 56px 0;
  }
}
.step-contents > *:last-child {
  margin-bottom: 0;
}
.step-contents .step-contents-img-wrap:last-child {
  margin-bottom: 0;
}
.step-contents-img-wrap {
  margin-bottom: 24px;
}
@media screen and (min-width: 560px) {
  .step-contents-img-wrap {
    margin-bottom: 48px;
  }
}
.step-contents-img-wrap > * {
  margin-bottom: 16px;
}
@media screen and (min-width: 560px) {
  .step-contents-img-wrap > * {
    margin-bottom: 24px;
  }
}
.step-contents-img-wrap > *:last-child {
  margin-bottom: 0;
}
.step-contents-img-wrap .emphasis-red-text {
  margin-bottom: 8px;
}
@media screen and (min-width: 560px) {
  .step-contents-img-wrap .emphasis-red-text {
    margin-bottom: 16px;
  }
}
.step-img {
  width: 23.2vw;
  max-width: 128px;
  margin-bottom: 20px;
}
.step-title {
  font-weight: bold;
  font-size: 5.87vw;
  margin: 0 0 24px;
}
@media screen and (min-width: 560px) {
  .step-title {
    font-size: 30px;
  }
}
.step-logo {
  width: 23.2vw;
  max-width: 96px;
  margin-bottom: 20px;
}
@media screen and (min-width: 560px) {
  .step-logo {
    margin: 16px 0 24px;
  }
}
.step-main-img {
  margin: 16px 0;
  max-width: 540px;
}
@media screen and (min-width: 560px) {
  .step-main-img {
    margin: 24px 0;
  }
}
.image-text {
  color: #666;
  font-weight: 600;
}
.dotted {
  height: 8px;
  width: 100%;
  background-image: url("../img/dot.svg");
  background-repeat: space;
}
.contents-sub-text {
  width: 100%;
  margin: 0;
}
@media screen and (min-width: 560px) {
  .contents-sub-text {
    margin-top: -8px;
  }
}
p.annotation {
  position: relative;
  padding: 0 0 0 1.5rem;
  margin-top: 0.5rem;
}
@media screen and (min-width: 560px) {
  p.annotation {
    font-size: 18px;
    padding: 0 0 0 2rem;
  }
}
p.annotation:before {
  content: "※";
  position: absolute;
  left: 0;
  top: 0;
}
.contents-error-wrap {
  font-size: 3.2vw;
  text-align: left;
}
@media screen and (min-width: 560px) {
  .contents-error-wrap {
    font-size: 18px;
    margin-top: 56px;
  }
}
.contents-error {
  padding: 16px 4.27vw;
  margin-bottom: 16px;
  background: #fff0f4;
  border-radius: 10px;
}
@media screen and (min-width: 560px) {
  .contents-error {
    padding: 24px;
    margin-bottom: 24px;
  }
}
.contents-error-title {
  font-size: 3.73vw;
  font-weight: bold;
  margin-bottom: 8px;
}
@media screen and (min-width: 560px) {
  .contents-error-title {
    font-size: 20px;
  }
}
.contents-intro {
  text-align: left;
  font-weight: 600;
}
@media screen and (min-width: 560px) {
  .contents-intro {
    font-size: 22px;
    line-height: 1.5;
  }
}
.contents-point {
  background: #fff7d3;
  color: #cb8c2d;
  padding: 14px;
  font-weight: 600;
  border-radius: 10px 10px 0 0;
  font-size: 4.27vw;
  margin: 32px 0;
}
@media screen and (min-width: 560px) {
  .contents-point {
    font-size: 24px;
    margin: 56px 0;
  }
}
.contents-feature {
  padding: 32px 0 0;
}
.contents-feature .image-text {
  margin-top: 16px;
  padding-bottom: 32px;
}
@media screen and (min-width: 560px) {
  .contents-feature .image-text {
    margin-top: 24px;
    padding-bottom: 56px;
  }
}
.contents-feature img {
  max-width: 540px;
}
.feature-img {
  height: 36px;
  width: auto;
  margin-bottom: 24px;
}
@media screen and (min-width: 560px) {
  .feature-img {
    height: 52px;
    margin-bottom: 40px;
  }
}
.terms-contents {
  padding-top: 0;
}
@media screen and (min-width: 560px) {
  .terms-contents {
    padding: 0px 40px 40px;
  }
}
@media screen and (min-width: 740px) {
  .terms-contents {
    padding: 0px 80px 40px;
  }
}
@media screen and (min-width: 560px) {
  .terms-contents .terms-title {
    font-size: 24px;
  }
}
.terms-detail {
  margin-top: 16px;
  padding: 16px;
  border-radius: 12px;
}
@media screen and (min-width: 560px) {
  .terms-detail {
    padding: 32px;
    margin-top: 32px;
  }
}
.terms-detail h2 {
  font-size: 15px;
}
@media screen and (min-width: 560px) {
  .terms-detail h2 {
    font-size: 16px;
  }
}
.terms-detail p,
.terms-detail li {
  font-size: 14px;
  line-height: 1.5;
}
.terms-detail p.annotation {
  font-size: 12px;
  padding-left: 1.5rem;
}
.terms-detail ol {
  padding-left: 1.8em;
  list-style: decimal;
}
.terms-detail ol li {
  margin-top: 0.5em;
}
.terms-block {
  margin-bottom: 24px;
}
@media screen and (min-width: 560px) {
  .terms-block {
    margin-bottom: 28px;
  }
}
.terms-block > * {
  margin-bottom: 8px;
}
.terms-block.no-margin {
  margin-bottom: 0;
}
.terms-block.bg-gray {
  padding: 24px;
  background: #f7f7f7;
  margin-bottom: 0;
  border-radius: 10px;
}
.terms-paragraph {
  padding-left: 1em;
}
.terms-detail-inner {
  border-top: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  padding: 24px 16px;
  margin-bottom: 32px;
}
.terms-detail-inner a {
  color: #007aff;
}
@media screen and (min-width: 560px) {
  .pc-hidden {
    display: none;
  }
}
@media screen and (min-width: 740px) {
  .pc-max-hidden {
    display: none;
  }
}
.to-top-wrap {
  position: absolute;
  width: 100%;
  max-width: 960px;
  top: 0;
  left: 0;
  right: 0;
  margin: 0 auto;
}
@media screen and (min-width: 560px) {
  .to-top-wrap {
    top: -10px;
  }
}
.to-top {
  right: 8px;
}
@media screen and (min-width: 560px) {
  .to-top {
    right: 18px;
  }
}
footer,
footer.emphasis {
  height: auto;
  max-width: none;
  left: 0;
  right: 0;
  text-align: center;
  background: none;
}
.footer-btn-wrap {
  padding: 16px 4.27vw;
  background: rgba(255,255,255,0.8);
  border-top: 1px solid #d6d6d6;
}
.copy {
  padding-bottom: 168px;
}
@media screen and (min-width: 560px) {
  .copy {
    padding-bottom: 180px;
  }
}
@media screen and (min-width: 560px) {
  .sp_only {
    display: none;
  }
}
.pc_only {
  display: none;
}
@media screen and (min-width: 560px) {
  .pc_only {
    display: inline-block;
  }
}