@charset "UTF-8";
/*--------------------------------------------------------
定数
--------------------------------------------------------*/
@media screen and (max-width: 1921px) {
  .visible1920 {
    display: block;
    margin: auto;
  }
  .hidden1920 {
    display: none;
  }
  .contents1920 {
    width: 100%;
    margin-left: 0px;
  }
}


@media screen and (max-width: 1001px) {
  .contents900 {
    width: 95%;
    margin-left: 2.5%;
  }
  .visible1000 {
    display: block;
  }
  .hidden1000 {
    display: none;
  }
  .contents {
    width: 100%;
  }
  .img_center {
    margin-left: 0px;
  }
  .img_center2 {
    margin-left: 0px;
  }
  .img_center3 {
    margin-left: 0px;
  }
  .img_center4 {
    margin-left: 0px;
  }
  body {
    min-width: 100%;
  }
  img {
    max-width: 100%;
    height: auto;
  }
  .marginl10 {
    margin-left: 5%;
  }
  .margin10p {
    margin-top: 5%;
  }
  .margin20p {
    margin-top: 5%;
  }
  .margin50p {
    margin-top: 5%;
  }
  .margin100p {
    margin-top: 10%;
  }
  .margin120p {
    margin-top: 12%;
  }
  .margin200p {
    margin-top: 20%;
  }
  .margin_100p {
    margin-top: -10%;
  }
  .margin_250p {
    margin-top: -30%;
  }
  .padding50p {
    padding-top: 5%;
  }
  .padding100p {
    padding-top: 10%;
  }
  .paddingb50p {
    padding-bottom: 5%;
  }
  .paddingb100p {
    padding-bottom: 10%;
  }
  .paddingb150p {
    padding-bottom: 20%;
  }
  .break_900:before {
    content: "\A";
    white-space: pre;
  }
  .img_center {
    margin-left: 0px;
  }
  .confirmation_text_area {
    /* position: absolute; */
    top: 35%;
    width: 100%;
  }
  .confirmation_area {
    width: 70%;
    margin-right: auto;
    margin-left: auto;
  }

  .image_payment_modal_btn_1 {
    position: absolute;
    bottom: 0%;
    left: 0%;
    transform: translate(0%);
  }

  .form {
    position: absolute;
    top: 25%;
  }

  .image_confirmation_01_1 {
    position: absolute;
    top: 11%;
  }
  .inputName {
    font-size: 25px;
    font-weight: bold;
    margin: 10px 5px 10px 5px;
    text-align: center;
  }
  .inputName div {
      display: inline-block;
  }
  .inputNamearea {
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    top: 5%;
    width: 100%;
    max-width: 1920px;
  }
}


/*--------------------------------------------------------
サイト毎に変化のある定数
--------------------------------------------------------*/

/*--------------------------------------------------------
各種レイアウト
--------------------------------------------------------*/

/*フォント*/

@media screen and (max-width: 901px) {
  .form-inner .title {
    font-size: 1.4em;
  }
  .form-field {
    font-size: 1.4em;
  }
  .radio-field {
    font-size: 1.4em;
  }
  .caution {
    font-size: 17px;
  }
  .youser_name {
    font-size: 50px;
  }
  .qr_text1 {
    font-size: 24px;
  }
  .qr_text2 {
    font-size: 25px;
  }
  .qr_text3 {
    font-size: 18px;
  }
  .checkbox {
    font-size: 25px;
  }
  .pay_text {
    font-size: 18px;
  }
  .pay_text2 {
    font-size: 30px;
  }

  .countdown {
    font-size: 29px;
    font-weight: bold;
    margin: 10px 5px 10px 5px;
    text-align: center;
  }
  .timer, .timer-1 {
    font-size: 29px;
    font-weight: bold;
    color: #e63c46;
  }
}

@media screen and (max-width: 701px) {
  .pay_text2 {
    font-size: 25px;
  }
  .countdown {
    font-size: 25px;
    font-weight: bold;
    margin: 10px 5px 10px 5px;
    text-align: center;
  }
  .timer, .timer-1 {
    font-size: 25px;
    font-weight: bold;
    color: #e63c46;
  }
}

@media screen and (max-width: 601px) {
  .form-inner .title {
    font-size: 1.2em;
  }
  .form-field {
    font-size: 1.2em;
  }
  .radio-field {
    font-size: 1.2em;
  }
  .caution {
    font-size: 15px;
  }
  .white_box.font16 {
    font-size: 14px;
  }
  .youser_name {
    font-size: 40px;
  }
  .qr_text1 {
    font-size: 19px;
  }
  .qr_text2 {
    font-size: 20px;
  }
  .qr_text3 {
    font-size: 16px;
  }
  .checkbox {
    font-size: 20px;
  }
  .countdown {
    font-size: 20px;
    font-weight: bold;
    margin: 8px 5px 8px 5px;
    text-align: center;
  }
  .timer, .timer-1 {
    font-size: 20px;
    font-weight: bold;
    color: #e63c46;
  }
}

@media screen and (max-width: 501px) {
  .youser_name {
    font-size: 30px;
  }
  .checkbox {
    font-size: 17px;
  }
  .pay_text {
    font-size: 16px;
  }
  .pay_text2 {
    font-size: 20px;
  }
  .countdown {
    font-size: 16px;
    font-weight: bold;
    margin: 8px 5px 8px 5px;
    text-align: center;
  }
  .timer, .timer-1 {
    font-size: 16px;
    font-weight: bold;
    color: #e63c46;
  }
}

@media screen and (max-width: 401px) {
  .form-inner .title {
    font-size: 1em;
  }
  .form-field {
    font-size: 1em;
  }
  .radio-field {
    font-size: 1em;
  }
  .caution {
    font-size: 13px;
  }
  .youser_name {
    font-size: 25px;
  }
  .qr_text1 {
    font-size: 15px;
  }
  .qr_text2 {
    font-size: 16px;
  }
  .qr_text3 {
    font-size: 14px;
  }
  .checkbox {
    font-size: 15px;
  }
  .white_box.font16 {
    font-size: 13px;
  }
  .pay_text {
    font-size: 14px;
  }
  .pay_text2 {
    font-size: 18px;
  }
  .countdown {
    font-size: 15px;
    font-weight: bold;
    margin: 8px 5px 8px 5px;
    text-align: center;
  }
  .timer, .timer-1 {
    font-size: 15px;
    font-weight: bold;
    color: #e63c46;
  }
}

/*その他レイアウト*/

@media screen and (max-width: 901px) {
  .white_area {
    width: 95%;
    padding-bottom: 4%;
  }
  .arky_01 {
    width: 102%;
    margin-left: -1%;
  }
  .arkyy-gif {
    width: 78%;
  }
  .arky_16 {
    width: 56%;
  }
  .arky_btn01 {
    width: 100%;
  }
  .white_area2 {
    width: 95%;
    padding-top: 1%;
    padding-bottom: 10%;
  }
  .arky_06,
  .arky_09,
  .arky_11,
  .arky_14,
  .arky_stepyama {
    width: 100%;
  }
  .arky_13 {
    width: 50%;
  }
  .white_area3 {
    width: 100%;
    padding-top: 5%;
    padding-bottom: 25%;
  }
  .arky_step1a {
    width: 36%;
  }
  .arky_step1b {
    width: 55%;
  }
  .arky_step2a {
    width: 50%;
  }
  .arky_step2b {
    width: 55%;
    right: -2%;
  }
  .stepsumaho {
    width: 40%;
  }
  .arky_step3a {
    width: 36%;
  }
  .arky_step3b {
    width: 55%;
  }
  .white_area4 {
    width: 100%;
    padding-top: 10%;
  }
  .fk_a .white_area4 {
    width: 100%;
  }
  .kakunin_area {
    width: 60%;
  }
  .arky_un_07 {
    width: 100%;
  }
  .arky_price_1980 {
    width: 100%;
  }
  .arky_btn02 {
    width: 100%;
  }
  .arky_un_popa {
    width: 70%;
  }
}

@media screen and (max-width: 701px) {
  .qr #top,
  .fk #top,
  .fk_a #top {
    height: 9vw;
  }
  .white_box.lawtext > div {
    height: 10em;
  }
  .qr_text3.w60 {
    width: 70%;
  }
  .checkbox {
    margin-left: 8%;
  }
  .close_btn {
    width: 10%;
  }
}

@media screen and (max-width: 501px) {
  .qr_text3.w60 {
    width: 80%;
  }
  .err_msg2 {
    font-size: 0.7em;
  }
}

@media screen and (max-width: 421px) {
  #top {
    height: 14vw;
  }
  .top_space {
    margin-top: 14%;
  }
  .arky_hdlogo,
  .arky_hdbtn {
    width: 50%;
  }
}

@media screen and (max-width: 401px) {
  .form-inner {
    width: 80%;
  }
  .white_box.lawtext > div {
    height: 8em;
  }
  .err_msg2 {
    font-size: 0.6em;
  }
}

/*--------------------------------------------------------
各種レイアウト
--------------------------------------------------------*/