@charset "UTF-8";
a.txtLink {
  text-decoration: underline;
  color: #0000ff;
  display: inline;
}

.bgOrange {
  background-color: #ffe2e2;
  padding: 10.4% 5.2% 7.2916%;
}

.stepBox {
  position: relative;
  background-color: #FFF;
  border-radius: 15px;
  max-width: 860px;
  margin: 0 auto;
  padding: 10.4% 0 7%;
}
@media only screen and (max-width: 959px) {
  .stepBox {
    padding-left: 5.2%;
    padding-right: 5.2%;
  }
}

.stepBox::before {
  position: absolute;
  content: "";
  background: url("../img/img_dec_step01.png") no-repeat center top/100%;
  top: -32px;
  left: 50%;
  width: 224px;
  height: 94px;
  transform: translateX(-50%);
}

.stepBox:nth-of-type(2)::before {
  background: url("../img/img_dec_step02.png") no-repeat center top/100%;
}

.stepBox:first-of-type::after {
  position: absolute;
  display: block;
  content: "";
  bottom: -6%;
  left: 50%;
  width: 0;
  height: 0;
  border-style: solid;
  border-right: 45px solid transparent;
  border-left: 45px solid transparent;
  border-top: 50px solid #ffffff;
  border-bottom: 0;
  transform: translate(-50%, 99%);
}

.stepBox + .stepBox {
  margin-top: 19%;
}

.stepBox_annotation {
  text-align: center;
  padding: 2.0832% 0 0;
}

@media only screen and (max-width: 640px) {
  .stepBox_annotation {
    font-size: 12.6px;
  }
}
.stepBox .contsImg,
.bgDaisy > .contsImg {
  max-width: 740px;
  padding: 0;
}

.stepBox .contsImg,
.stepBox_annotation {
  width: 86.1%;
  margin: 0 auto;
}

.contsImg.contsImgTtl {
  display: flex;
  justify-content: center;
}
.contsImg.contsImgTtl img {
  width: auto;
}
@media only screen and (max-width: 959px) {
  .contsImg.contsImgTtl img {
    width: 100%;
  }
}

.mw960 {
  max-width: 860px !important;
  padding: 0;
}
@media only screen and (max-width: 959px) {
  .mw960 {
    padding-left: 5.2%;
    padding-right: 5.2%;
  }
}

.coordinationBtn a,
.entryBtn a {
  max-width: 740px;
  width: 77.1%;
  margin: 0 auto;
}

.stepBox .coordinationBtn a,
.stepBox .entryBtn a {
  max-width: 740px;
  width: 86.1%;
}

.orange_bg {
  background-color: #ffe2e2;
}

.bgYellow {
  background-color: #fffbe9;
}

.topBorder, .bottomBorder {
  position: relative;
}

.topBorder::before, .bottomBorder::after {
  position: absolute;
  content: "";
  left: 0;
  width: 100%;
  height: 4px;
}

.topBorder::before {
  background: url(../img/bg_01.png) no-repeat center top, #FFF;
  top: 0;
}

.bottomBorder::after {
  background: url(../img/bg_01.png) no-repeat center bottom, #FFF;
  bottom: 0;
}

.coordination_status {
  padding: 10.4% 0 17%;
}

.coordination_merit {
  padding: 26% 0 10%;
}

.coordination_merit .imgTtl {
  position: absolute;
  top: -3.75%;
  left: 0;
}

.coordination_status .contsImg,
.coordination_merit .contsImg,
.coordination_privilege .contsImg {
  max-width: 860px;
  padding: 0;
}
@media only screen and (max-width: 959px) {
  .coordination_status .contsImg,
  .coordination_merit .contsImg,
  .coordination_privilege .contsImg {
    padding-left: 5.2%;
    padding-right: 5.2%;
  }
}

.bnrArea, .coordination_privilege {
  padding: 11% 0;
}

.bnrArea .bnrLink a {
  display: block;
  max-width: 840px;
  width: 87.5%;
  margin: 0 auto;
}

.bnrAttentionNote {
  font-size: 18px;
}
@media only screen and (max-width: 959px) {
  .bnrAttentionNote {
    font-size: 10px;
  }
}

#campaign {
  padding: 9% 0 6%;
}

/* ご注意事項 */
.cpNotes01 {
  max-width: 840px;
  width: 87.5%;
  margin: 0 auto;
}

.cpNotesBtn01 {
  width: 100%;
  display: table;
}

.cpNotesBtn01 a {
  width: 100%;
  display: table-cell;
  vertical-align: middle;
  border-top: 1px solid #cc0033;
}

.cpNotesFlame01 {
  display: none;
  background-color: #fff;
  border-left: 2px solid #cc0033;
  border-right: 2px solid #cc0033;
  border-bottom: 2px solid #cc0033;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

@media only screen and (min-width: 361px) {
  .cpNotesFlame01 {
    border-width: 3px;
  }
}
.contsTxt.cpCode {
  margin-top: 1.0416%;
  padding: 0 6.25% 4.1664%;
}
.contsTxt.note {
  font-size: 18px;
  padding: 0 5%;
}
@media only screen and (max-width: 959px) {
  .contsTxt.note {
    font-size: 12px;
  }
}

@media only screen and (max-width: 959px) {
  .stepBox::before {
    top: -3.3vw;
    width: 23.4vw;
    height: 9.8vw;
  }
  .stepBox:first-of-type::after {
    border-right: 4.7vw solid transparent;
    border-left: 4.7vw solid transparent;
    border-top: 5.2vw solid #ffffff;
  }
}
@media screen and (max-width: 640px) {
  .topBorder::before, .bottomBorder::after {
    height: 2px;
    background-repeat: repeat-x;
    background-size: contain;
  }
}
/* フローティングバナー */
.floatSpBnr {
  width: 100%;
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 2;
  box-sizing: border-box;
}

.floatSpLink {
  width: 100%;
  margin: 0 auto;
  display: block;
}

.floatSpBnr img {
  width: 100%;
}

.floatPcBnr {
  height: 78%;
  margin: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 2;
}
.floatPcBnr a:first-child {
  width: 7.5vh;
}
.floatPcBnr a:last-child {
  width: 10.4vh;
}

.floatPcLink + .floatPcLink {
  margin-top: 19%;
}

.floatPcLink img {
  height: 100%;
}

a.floatPcLink {
  display: block;
}

@media only screen and (max-width: 959px) and (min-width: 641px) {
  .floatPcBnr {
    width: 13.85%;
  }
}
@media only screen and (max-width: 640px) {
  .floatSpBnr, a.floatSpLink {
    display: block;
  }
  .floatPcBnr, a.floatPcLink {
    display: none;
  }
  .flbnpb {
    padding-bottom: 45% !important;
  }
}
.contsImg.step1 {
  width: 38.2291666667%;
}
.contsImg.step2 {
  width: 47.8125%;
}
.contsImg.notes {
  width: 72.9166666667%;
}
.contsImg.term {
  width: 72.9166666667%;
}
.contsImg.ttl1 {
  width: 63.9583333333%;
}
.contsImg.ttl2 {
  width: 74.5833333333%;
}
.contsImg.benefitsImg {
  width: 100%;
  padding: 0;
  margin: 0;
}
.contsImg.howGet {
  width: 42.0833333333%;
}

.benefits {
  background: #00aab3;
}
.benefits .contsImg {
  display: flex;
  justify-content: center;
}
.benefits .contsImg img {
  width: 100%;
}
.benefits .cpNotesList {
  color: #000;
  text-align: center;
}

.benefitsWrap {
  max-width: 894px;
  width: 100%;
  margin: 22px auto;
  padding: 22px 0;
  background-color: #fff;
  border-radius: 12px;
}

.benefitsFlex {
  display: flex;
  gap: 20px;
  padding: 0 4.5%;
  flex-direction: row;
  justify-content: center;
}

input[type=checkbox],
input[type=radio] {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0;
}

/* ------------------------------------
	* メインコンテンツ
* ------------------------------------ */
a.txtLink {
  text-decoration: underline;
  color: #0000ff;
  display: inline;
}

input[type=radio] {
  /*  position: absolute;
    top: 1.0em;
    left: 1.5em;*/
  appearance: auto;
  accent-color: #028bff;
  -webkit-transform: scale(3);
  -ms-transform: scale(3);
  transform: scale(3);
}

input[type=checkbox] {
  transform: scale(2);
}

main {
  background: #fff;
}

#wrapper {
  max-width: 960px;
  background-color: #FFF;
  margin: 0 auto;
  padding-bottom: 5.2083%;
}

.fwB {
  font-weight: bold;
}

.fsL, .fsL02 {
  font-size: 36px;
}

.dBlock {
  display: block;
}

.textCenter {
  text-align: center;
}

.textRight {
  text-align: right;
  padding: 10px 10px 0;
}

.textLeft {
  text-align: left;
}

.txtIndent {
  text-indent: -1em;
  padding-left: 1em;
}

.invisibleTxt {
  display: none;
}

.contents {
  width: 100%;
  background: #00aab3;
  margin: 0 auto;
  padding-bottom: 8%;
  font-size: 24px;
}

.contents * {
  box-sizing: border-box;
}

.cWhite {
  color: #FFF;
}

.contsTtl {
  text-align: center;
}

.contsKv {
  width: 100%;
}
.contsKv > img {
  width: 100%;
}

.contsKv.dummy {
  background: #d4d4d4;
  height: 500px;
}

.contsBox {
  max-width: 880px;
  width: 91.7%;
  background: #FFF;
  border-radius: 35px;
  margin: 5.2083% auto 0;
  padding: 4.1666% 3.2%;
}

.contsBox > .contsTxt {
  margin: 0 8.3333%;
}

.contsTxt.wide {
  font-size: 30px;
  margin: 0;
}
@media only screen and (max-width: 767px) {
  .contsTxt.wide {
    font-size: 20px;
  }
}

.contsTxt.note {
  font-size: 20px;
}
@media only screen and (max-width: 767px) {
  .contsTxt.note {
    font-size: 12px;
  }
}

.w75p {
  max-width: 720px;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (max-width: 959px) {
  .w75p {
    width: auto;
    max-width: 100%;
  }
}

.w85p {
  max-width: 850px;
  width: 100%;
  margin: 0 auto;
}
@media only screen and (max-width: 959px) {
  .w85p {
    width: auto;
    max-width: 100%;
  }
}

.cooperationBtn, .enterBtn {
  max-width: 700px;
  margin: 0 auto;
}

.cooperationText {
  font-size: 40px;
  font-weight: bold;
  text-align: center;
}
@media only screen and (max-width: 767px) {
  .cooperationText {
    font-size: 20px;
  }
}

.cooperationCopyBtn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  border-radius: 20px;
}
.cooperationCopyBtn > button {
  border: none;
  border-radius: 20px;
  background-color: #fff;
  max-width: 800px;
  width: 100%;
  text-align: center;
  padding: 20px 60px;
  color: #333;
}
@media only screen and (max-width: 767px) {
  .cooperationCopyBtn > button {
    max-width: 90%;
    padding: 10px 30px;
  }
}

.enterBtn {
  width: 79.6%;
}

.totop {
  margin: 5.2083% 0 0;
}

.campaignBtn {
  max-width: 590px;
  width: 61.46%;
  margin: 0 auto;
}

.policyWrap {
  max-width: 720px;
  width: 82%;
  margin: 0 auto;
}

.policy {
  margin: 20px auto;
}

.policyWrap .policy {
  display: flex;
  align-items: start;
}

.policyWrap .policy input[type=checkbox] {
  position: relative;
  top: 10px;
}

.policyWrap .policy label {
  padding-left: 1em;
  text-indent: -1em;
}

.policy span {
  position: relative;
  top: 0.08em;
  margin-left: 0.5em;
}

.policyWrap .policy span {
  margin-left: 1em;
}

.form_btn {
  max-width: 700px;
  width: 79.6%;
}

.contsCoupon,
.contsCouponWrap {
  max-width: 880px;
  width: 91.7%;
  background: #FFF;
  margin: 0 auto;
  padding: 50px 50px 34px;
  border-radius: 50px;
}

.contsCoupon {
  color: #333;
  padding: 50px;
}

.contsCouponWrap > .contsImg {
  min-width: 300px;
}

.contsCoupon.qr {
  max-width: 690px;
  width: 71.875%;
  border-radius: 30px;
}

.contsCoupon.qr_fixed {
  background: transparent;
  padding: 0;
  border-radius: 0;
}

.w820 {
  max-width: 820px;
  width: 85.5%;
  margin: 0 auto;
}

.couponTxt p {
  color: #333;
  text-align: center;
}

.restArea {
  display: inline-block;
  font-size: 40px;
  line-height: 1.6;
  color: #f30000;
  margin: 0 auto;
  padding: 1.0416% 4.1666% 0.5208%;
}

.restArea02 {
  display: none;
  font-size: 40px;
  line-height: 1.6;
  color: #FFF;
  margin: 0 auto;
  padding: 1.0416% 4.1666% 0.5208%;
}

html:not(.enable-javascript) .restArea {
  display: none;
}

html:not(.enable-javascript) .restArea02 {
  display: inline-block;
  color: #FFF;
}

html:not(.enable-javascript) .txtArea02 {
  display: none;
}

@media only screen and (max-width: 767px) {
  .fsL02 {
    font-size: 16px;
  }
}
@media only screen and (max-width: 640px) {
  input[type=checkbox] {
    transform: scale(1.4);
  }
  .fsL {
    font-size: 20px;
  }
  .fsL02 {
    font-size: 14px;
  }
  .policyWrap .policy input[type=checkbox] {
    position: relative;
    top: 6px;
  }
  .contents {
    font-size: 16px;
  }
  .contsKv.dummy {
    height: 52.1vw;
  }
  .contsBox {
    border-radius: 10px;
    padding: 6.25% 4.1666%;
  }
  .contsBox > .contsTxt {
    width: 100%;
    margin: 0;
  }
  .cooperationBtn {
    width: 79.6%;
  }
  .form_btn {
    width: 100%;
  }
  .contsCoupon,
  .contsCouponWrap {
    border-radius: 10px;
    padding: 4.1666%;
  }
  .contsCoupon.qr {
    border-radius: 10px;
  }
  .campaignBtn {
    width: 89.6%;
  }
  .restArea {
    font-size: 20px;
  }
}
/*フォーム*/
.Form_Q_radioinput {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin: 0 4.166%;
}

.Form_Q_radioinput label {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 420px;
  width: 48%;
  background: #FFF;
  color: #333;
  text-align: center;
  border-radius: 20px;
  padding: 2% 2% 4%;
}

.Form_Q_radioinput label:nth-of-type(even) {
  margin-left: 4%;
}

.Form_Q_radioinput label:nth-of-type(n + 3) {
  margin-top: 4%;
}

.Form_Q_radioinput label.inactive {
  pointer-events: none;
}

.Form_Q_radioinput label.inactive::after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 20px;
  background-image: url(../img/img_top3_grayout.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.Form_Q_radioinput label .radio_ttl {
  display: flex;
  justify-content: center;
  align-items: center;
}

.Form_Q_radioinput label span {
  margin-left: 0.8em;
}

.Form_Q_radioinput label img {
  max-width: 340px;
  width: 100%;
  margin-top: 2%;
}

.Form__btn input[type=image] {
  max-width: 700px;
  width: 73%;
}

@media only screen and (max-width: 767px) {
  input[type=radio] {
    /*    top: 1.2em;
        left: 2.5em;*/
    transform: scale(2);
  }
}
@media only screen and (max-width: 640px) {
  input[type=radio] {
    /*top: 1.1em;
    left: 2.5em;*/
    transform: scale(1.2);
  }
  .Form_Q_radioinput label {
    border-radius: 10px;
  }
  .Form_Q_radioinput label.inactive::after {
    border-radius: 10px;
  }
  .Form_Q_radioinput label span {
    margin-left: 0.4em;
  }
}
@media only screen and (max-width: 460px) {
  .Form_Q_radioinput {
    font-size: 12px;
  }
}
@media only screen and (max-width: 360px) {
  .contsCouponWrap {
    width: 100%;
    border-radius: 0;
    padding: 4.1666% 0;
  }
  .contsCouponWrap > .contsImg {
    margin: 0 calc((100vw - 300px) / 2);
  }
}
.box_inner div {
  line-height: 1.5;
}

/* フォーム */
button {
  display: block;
}

input[type=radio]:checked + .radio:before {
  opacity: 1;
}

/* ------------------------------------
	* btn
* ------------------------------------ */
.btn_input {
  display: block;
  border-style: none;
  height: 50px;
  text-align: center;
  line-height: 50px;
  background-color: #a9a9a9;
  color: #fff;
  font-size: 16px;
  font-weight: bold;
  position: relative;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  margin: 30px auto;
  width: 92%;
}

.btn_input::before {
  display: block;
  content: "";
  position: absolute;
  width: 10px;
  height: 10px;
  top: 16px;
  right: 4px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  border: 8px solid transparent;
  border-left: 10px solid #FFF;
}

a.btn_input {
  color: #fff;
}

/* キャンペーンページに戻る */
.mod-btn-main {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: table;
  width: 92%;
  margin: 20px auto;
}

.mod-btn-main a {
  display: table-cell !important;
  height: 45px;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  padding: 0 !important;
  background-color: #3e2b23;
  text-align: center;
  vertical-align: middle;
  position: relative;
}

.mod-btn-regist a {
  background-color: #cc0033;
}

.mod-btn-close input[type=button] {
  background-color: #a9a9a9;
  display: table-cell !important;
  height: 45px;
  width: 100%;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  padding: 0 !important;
  margin: 0 auto;
  vertical-align: middle;
  position: relative;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.mod-btn-main a:after {
  content: "";
  display: inline-block;
  background: url(../img_ep/up_arrow.png) no-repeat;
  background-size: 20px;
  width: 20px;
  height: 20px;
  position: absolute;
  right: 5%;
  top: 35%;
}

.mod-btn-main .btn-inner {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-table;
  position: relative;
  padding: 3% 11%;
  font-size: 14px;
  color: #fff;
  line-height: 1.5;
}

.btn-innerSpan {
  display: table-cell;
  text-align: center;
}

.btn-innerTxt {
  display: inline-block;
}

.mod-btn-main .btn-inner::after {
  margin-top: -4px !important;
  right: 10px !important;
}

.mod-btn-notes {
  padding: 0 10px 20px;
  text-align: center;
}

/* 戻る */
ul.btn_link {
  display: table;
  width: 100%;
  border-collapse: separate;
  border-spacing: 10px;
}

ul.btn_link li {
  display: table-cell;
  width: 50%;
  text-align: center;
}

ul.btn_link .change_btn {
  -moz-box-shadow: inset 0px 39px 0px -24px #90b5e1;
  -webkit-box-shadow: inset 0px 39px 0px -24px #90b5e1;
  box-shadow: inset 0px 47px 0px -24px #90b5e1;
  background-color: #7face2;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  cursor: pointer;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 15px;
  display: block;
  width: 100%;
  text-align: center;
  border-style: none;
}

ul.btn_link .change_btn:hover {
  background-color: #82b7f7;
}

ul.btn_link .change_btn:active {
  position: relative;
  top: 1px;
}

/* OK */
ul.btn_link .ok_btn {
  -moz-box-shadow: inset 0px 39px 0px -24px #e67a73;
  -webkit-box-shadow: inset 0px 39px 0px -24px #e67a73;
  box-shadow: inset 0px 47px 0px -24px #e67a73;
  background-color: #e26d66;
  -moz-border-radius: 30px;
  -webkit-border-radius: 30px;
  border-radius: 30px;
  cursor: pointer;
  font-weight: bold;
  font-size: 18px;
  padding: 14px 15px;
  display: block;
  width: 100%;
  text-align: center;
  border-style: none;
}

ul.btn_link .ok_btn:hover {
  background-color: #ef7b75;
}

ul.btn_link .ok_btn:active {
  position: relative;
  top: 1px;
}

.checkTtl {
  box-sizing: border-box;
  position: relative;
  display: inline-block;
  width: 100%;
  padding: 6px 0px 3px 10px;
  vertical-align: middle;
  font-size: 22px;
  background-color: #fff0b1;
  border-top: 2px dotted #ffd93a;
  border-bottom: 2px dotted #ffd93a;
  color: #ff4500;
  font-weight: bold;
  line-height: 1.3;
  text-align: center;
}

#get_campaign {
  height: 80px;
  display: table;
  width: 100%;
  outline: 1px solid #f11717;
  outline-offset: -5px;
  box-sizing: border-box;
  border: 2px solid #f11717;
  -webkit-box-shadow: 2px 2px 2px #f3f1f1;
  -moz-box-shadow: 2px 2px 2px #f3f1f1;
  box-shadow: 3px 3px 2px #eae8e8;
  margin: 0px auto 20px;
  text-align: center;
}

#get_campaign p {
  font-size: 21px;
  font-weight: bold;
  display: table-cell;
  vertical-align: middle;
  color: #f11717;
}

h2.main-text {
  background-color: #006cb7;
  padding: 10px;
  font-size: 18px;
  text-align: center;
  color: #fff;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

.ttlTxt {
  font-size: 0.9rem;
  text-align: center;
  margin: 0;
  padding: 6% 0 0;
}

.redirectTxt {
  color: #ccc;
  text-align: center;
  padding: 10px 10px 30px;
  font-size: 16px;
}

.entryTxtLink {
  color: #ccc !important;
  text-align: center;
  padding: 0px 10px;
  text-decoration: underline !important;
  font-size: 16px;
}

.input_checkBox {
  width: 24px;
  height: 16px;
}

.txtCenter {
  text-align: center;
}