@charset "utf-8";

/*------------  campaign  ------------*/

#campaign { box-sizing: border-box; margin: 0 auto; padding: 50px 3% 50px; max-width: 1120px; }
.campaign-inner { background: #fff; border-radius: 28px; overflow: hidden; }

.main {}
.main a { display: block; }

.info { padding: 35px 5% 0; }
.info .link { display: flex; justify-content: center; align-items: center; padding: 18px 3%; background: #057eb0; border-radius: 12px; }
.info .icon { margin: 0 18px 0 0; width: 26px; }
.info .icon .icon-img { width: 100%; }
.info .txt { font-family: 'Noto Sans JP', sans-serif; font-size: 22px; font-weight: 900; line-height: 1.3; color: #fff; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing:.03em; }


.single { display: flex; justify-content: center; align-items: center; margin: 0 auto; padding: 15px 20px 25px; }
.single .card { width: 16%; background: #fff; text-align: center; }
.single .block { padding: 0 10px 0 15px; line-height: 1.4; color: #222; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing:.03em; }
.single .lead { padding: 0 0 6px; font-family: 'Noto Sans JP', sans-serif; font-size: 30px; font-weight: 900; }
.single .txt { font-family: sans-serif; font-weight: bold; font-size: 18px; }


.btn-entry { padding: 0 5% 40px; }
.btn-entry img { width: 100%; }
.btn-entry a { display: flex; justify-content: center; align-items: center; padding: 18px 3%; background: #bb2828; border-radius: 12px; }
.btn-entry .icon { margin: 0 18px 0 0; width: 26px; }
.btn-entry .txt { font-family: 'Noto Sans JP', sans-serif; font-size: 22px; font-weight: 900; line-height: 1.3; color: #fff; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing:.03em; }


.campaign-block { padding: 0 5%; }

.points { padding: 35px 0; }
.points .ttl { padding: 0 0 16px; font-family: 'Noto Sans JP', sans-serif; font-size: 24px; font-weight: 900; line-height: 1.3; color: #008ac2; text-align: center; }
.points ul { display: flex; justify-content: center; box-sizing: border-box; margin: 0 auto; max-width: 840px; }
.points li { display: block; padding: 0 1.8%; width: 25%; }
.points a { display: block; }
.points .box { display: block; padding: 8px; }
.points a .box { border: 1px solid #008ac2; border-radius: 12px; overflow: hidden; }

.step { box-sizing: border-box; border-top: 1px solid #008ac2; border-bottom: 1px solid #008ac2; font-family: 'Noto Sans JP', sans-serif; font-size: 28px; font-weight: 900; line-height: 1.3; color: #008ac2; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing:.04em; }
.step .item { width: 100%; padding: 16px 3.5%; text-align: center; -webkit-font-feature-settings:'palt' 1; font-feature-settings:'palt' 1; letter-spacing:.03em; }
.step .item .item1 { display: inline-block; padding: 0 1em 0 0; }
.step .item .item2 { display: inline-block; }

.coupon-block { padding: 40px 0 0; }
.coupon-block .link { display: block; padding: 16px 68px 16px 24px; border-radius: 8px; color: #fff; background: url('/images/campaign/coupon_dot.png') no-repeat right #08205b; background-size: contain; }
.coupon-block .name { padding: 0 0 10px; font-family: 'Noto Sans JP', sans-serif; font-size: 26px; font-weight: 900; line-height: 1.3; }
.coupon-block .time { font-family: sans-serif; font-size: 14px; line-height: 1.3; }

.notes { padding: 40px 0 55px; text-align: center; }
.notes span { display: inline-block; margin: 0 auto; padding: 0 0 12px; background: url('/images/campaign/notes_line.png') repeat-x bottom; background-size: 10px 6px; font-family: 'Noto Sans JP', sans-serif; font-size: 24px; font-weight: 900; color: #008ac2; }

.summary { padding: 40px 4% 35px; }
.summary dt { padding: 0 0 9px; }
.summary .item { font-family: 'Noto Sans JP', sans-serif; font-size: 18px; font-weight: 700; line-height: 1.4; color: #008ac2; }
.summary dd { padding: 0 0 25px; }
.summary .txt { padding: 0 0 9px; font-size: 16px; line-height: 1.5; }
.summary .group { margin: 0 1.4em; list-style-type: inherit; }

.btn-home { margin: 0 auto; padding: 0 0 70px; width: 320px; }
.btn-home a { display: block; height: 60px; background: url('/images/campaign/btn_home.png') no-repeat center #057eb0; background-size: 140px 18px; border-radius: 30px; text-indent: -9999px; overflow: hidden; }









@media screen and (max-width: 920px) {


  .info .txt { font-size: 22px; }

  .single { padding: 22px 20px; }
  .single .block { padding: 0 0 0 20px; }
  .single .lead { padding: 0 0 6px; font-size: 26px; }
  .single .txt { font-size: 16px; }


  .step { font-size: 24px; }

}






@media screen and (max-width: 740px) {

  #campaign { padding: 20px 3% 25px; }
  .campaign-inner { border-radius: 12px; }

  .info { padding: 20px 3% 0; }
  .info .link { padding: 14px 3%; border-radius: 6px; }
  .info .icon { margin: 0 10px 0 0; width: 16px; }
  .info .txt { font-size: 14px; }

  .single { margin: 0 auto; padding: 0 3% 12px; }
  .single .card { width: 84px; }
  .single .block { padding: 0 5px 0 6px; }
  .single .lead { padding: 0 0 3px; font-size: 15px; }
  .single .txt { font-size: 13px; }

  .btn-entry { padding: 0 3% 22px; }
  .btn-entry a { padding: 14px 3%; border-radius: 6px; }
  .btn-entry .icon { margin: 0 10px 0 0; width: 16px; }
  .btn-entry .txt { font-size: 14px; }

  .campaign-block { padding: 0 3%; }

  .points { padding: 10px 4%; }
  .points .box { padding: 4%; }

  .points { padding: 18px 0; }
  .points .ttl { padding: 0 0 10px; font-size: 16px; }
  .points ul {}
  .points li { padding: 0 1.2%; width: 25%; }
  .points .box { padding: 4px; }
  .points a .box { border-radius: 6px; }

  .step { flex-direction: column; justify-content: center; font-size: 16px; }
  .step .item { width: auto; padding: 10px 2%; text-align: center; }
  .step .item .item1 { display: block; padding: 0 0 2px; }
  .step .item .item2 { display: block; }

  .coupon-block { padding: 22px 0 0; }
  .coupon-block .link { padding: 12px 52px 12px 14px; border-radius: 6px; }
  .coupon-block .name { padding: 0 0 8px; font-size: 18px; }
  .coupon-block .time { font-size: 13px; }

  .notes { padding: 20px 0 30px; text-align: center; }
  .notes span { padding: 0 0 10px; background-size: 8px 4px; font-size: 16px; font-weight: 900; }

  .summary { padding: 30px 0 10px; }
  .summary dt { padding: 0 0 6px; }
  .summary .item { font-size: 14px; }
  .summary dd { padding: 0 0 20px; }
  .summary .txt { padding: 0 0 6px; font-size: 14px; }

  .btn-home { padding: 0 0 30px; width: 260px; }
  .btn-home a { height: 48px; background-size: 108px 14px; border-radius: 24px; }


}

