@charset "UTF-8";
@media screen and (max-width: 900px) {
  /*--------------------------------------------------------
  定数
  --------------------------------------------------------*/
  .visible900 {
    display: block;
    margin: auto;
  }

  .hidden900 {
    display: none;
  }

  /*--------------------------------------------------------
  定数（基本的に、全サイト共通に使えるもの）
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  サイト毎に変化のある定数
  --------------------------------------------------------*/
  .contents {
    width: 100%;
  }

  .img_center {
    margin-left: 0px;
  }

  img {
    width: 100%;
    max-width: 100%;
    height: auto;
  }

  /*--------------------------------------------------------
  フッター
  --------------------------------------------------------*/
  /*--------------------------------------------------------
    ↓↓↓ 各種レイアウト ↓↓↓
  --------------------------------------------------------*/
  /* --共通-- */
  /* --共通-- */
  /*--header--*/
  /*--header-end--*/
  /*--contents--*/
  div[class*="fgm"] img {
    width: 100%;
  }

  .fgm_01 img {
    height: calc(100vw * (1667 / 900));
  }
  .fgm_01_tt img {
    height: calc(100vw * (677 / 900));
  }
  .fgm_01_arw img {
    height: calc(100vw * (73 / 900));
  }

  .fgm_btn img {
    height: calc(100vw * (288 / 900));
  }

  .fgm_02 img {
    height: calc(100vw * (2530 / 900));
  }
  .fgm_02_arw {
    width: 14%;
  }
  .fgm_02_arw img {
    height: calc((124 / 900 * 100vw) * (89 / 124));
  }
  .fgm_02_arw02 {
    width: 14%;
  }
  .fgm_02_arw02 img {
    height: calc((124 / 900 * 100vw) * (89 / 124));
  }

  .fgm_03 img {
    height: calc(100vw * (2141 / 900));
  }

  .fgm_04 img {
    height: calc(100vw * (1552 / 900));
  }
  .fgm_04_dcc {
    width: 43%;
  }
  .fgm_04_dcc img {
    height: calc((385 / 900 * 100vw) * (728 / 385));
  }
  .fgm_04_btn {
    width: 63%;
  }
  .fgm_04_btn img {
    height: calc((569 / 900 * 100vw) * (307 / 569));
  }
  .fgm_04_arw {
    width: 35%;
  }
  .fgm_04_arw img {
    height: calc((315 / 900 * 100vw) * (98 / 315));
  }

  .fgm_05 img {
    height: calc(100vw * (1342 / 900));
  }

  .fgm_06 img {
    height: calc(100vw * (2512 / 900));
  }
  .fgm_06_btn img {
    height: calc(100vw * (210 / 900));
  }

  .radio_box_wrapper .gender > li > .radio_box input + .radio_btn::before,
  .radio_box_wrapper
    .gender
    > li
    > .radio_box
    input:checked
    + .radio_btn::before {
    width: 42%;
    height: 0;
    padding-top: 14%;
  }

  .radio_box_wrapper li .radio_box input + .radio_btn::before {
    width: 41.8%;
    height: 0;
    padding-top: 15%;
    /*calc(画像の高さ / 画像の幅 * widthの値)*/
  }

  .radio_box_wrapper
    .reward
    > li:nth-of-type(5)
    > .radio_box
    input
    + .radio_btn::before,
  .radio_box_wrapper
    .reward
    > li:nth-of-type(5)
    > .radio_box
    input:checked
    + .radio_btn::before {
    width: 84.4%;
    height: 0;
    padding-top: 15%;
  }

  .radio_box_wrapper
    .usagetime
    > li:nth-of-type(5)
    > .radio_box
    input
    + .radio_btn::before,
  .radio_box_wrapper
    .usagetime
    > li:nth-of-type(5)
    > .radio_box
    input:checked
    + .radio_btn::before {
    width: 84.4%;
    height: 0;
    padding-top: 15%;
  }

  /*--contents-end--*/
  /*--footer--*/
  /*--footer-end--*/
  /* --プラポリ-- */
  .fgm_back {
    width: 51.8%;
  }
  .fgm_back img {
    height: calc((420 / 900 * 100vw) * (153 / 420));
  }

  .fgm_back_2 {
    width: 47%;
  }
  .fgm_back_2 img {
    height: calc((420 / 900 * 100vw) * (153 / 420));
  }

  /* --プラポリ-end-- */
  /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
  --------------------------------------------------------*/
}
@media screen and (max-width: 700px) {
  /*--------------------------------------------------------
  ↓↓↓ 各種レイアウト ↓↓↓
  --------------------------------------------------------*/
  /* --共通-- */
  /* --共通-- */
  /*--header--*/
  /*--header-end--*/
  /*--contents--*/
  /*--contents-end--*/
  /*--footer--*/
  .copyright {
    padding: 0;
  }

  .copyright,
  .copyright a {
    font-size: 2.5vw;
  }

  /*--footer-end--*/
  /*--------------------------------------------------------
  ↑↑↑ 各種レイアウト ↑↑↑
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↓↓↓ フォーム部分 ↓↓↓
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↑↑↑ フォーム部分 ↑↑↑
  --------------------------------------------------------*/
}
@media screen and (max-width: 640px) {
  .law_wrap p, .privacy_wrap p, .service_wrap p{
    font-size: 1.5rem;
  }
  /*--------------------------------------------------------
  ↓↓↓ 各種レイアウト ↓↓↓
  --------------------------------------------------------*/
  /* --共通-- */
  /* --共通-- */
  /*--header--*/
  /*--header-end--*/
  /*--contents--*/
  /*--contents-end--*/
  /*--footer--*/
  /*--footer-end--*/
  /*--------------------------------------------------------
  ↑↑↑ 各種レイアウト ↑↑↑
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↓↓↓ フォーム部分 ↓↓↓
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↑↑↑ フォーム部分 ↑↑↑
  --------------------------------------------------------*/
}
@media screen and (max-width: 600px) {
  .law_wrap p, .privacy_wrap p, .service_wrap{
    font-size: 1.2rem;
  }
  .visible600 {
    display: block;
    margin: auto;
  }

  .hidden600 {
    display: none;
  }

  body {
    font-size: 1.6rem;
  }

  /*todo 要調査*/
  /*--------------------------------------------------------
  サイト毎に変化のある定数
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  フッター
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↓↓↓ 各種レイアウト ↓↓↓
  --------------------------------------------------------*/
  /* --共通-- */
  /* --共通-- */
  /*--header--*/
  /*--header-end--*/
  /*--contents--*/
  /*--contents-end--*/
  /*--footer--*/
  /*--footer-end--*/
  /* --プラポリ-- */
  .privacy_contents {
    font-size: 1.4rem;
  }

  /* --特商法-- */
  .law_text:nth-of-type(2) {
    top: 18.8%;
  }

  .law_text:nth-of-type(3) {
    top: 39.3%;
  }

  /*--------------------------------------------------------
  ↑↑↑ 各種レイアウト ↑↑↑
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↓↓↓ フォーム部分 ↓↓↓
  --------------------------------------------------------*/
  /*--------------------------------------------------------
  ↑↑↑ フォーム部分 ↑↑↑
  --------------------------------------------------------*/
}
@media screen and (max-width: 500px) {
  .cookie_subtitle, .privacy_subtitle {
 
    font-size: 1.5rem;
}
.law_subtitle{
  font-size: 1.3rem;
}

  .visible500 {
    display: block;
    margin: auto;
  }
  .law_subtitle{
    font-size: 1.3rem;
  }
  .hidden500 {
    display: none;
  }

  /*--------------------------------------------------------
  ↓↓↓ 各種レイアウト ↓↓↓
  --------------------------------------------------------*/
  /*--------------------------------------------------------
    ↑↑↑ 各種レイアウト ↑↑↑
  --------------------------------------------------------*/
}
@media screen and (max-width: 450px) {
  .law_title {
    font-size: 2rem;
  }
}
@media screen and (max-width: 400px) {
  .visible400 {
    display: block;
    margin: auto;
  }

  .hidden400 {
    display: none;
  }

  .privacy_subtitle {
    font-size: 1em;
  }

  .copyright,
  .copyright a {
    font-size: 1rem;
    line-height: 1.3;
  }

  /* --特商法-- */
  .law_text:nth-of-type(2) {
    top: 18.5%;
  }

  .law_text:nth-of-type(3) {
    top: 39%;
  }
}
@media screen and (max-width: 320px) {
  .visible320 {
    display: block;
    margin: auto;
  }

  .hidden320 {
    display: none;
  }
}
/* 319px以下の場合　これ以上小さくしたくない場合は横スクロール対応 */
@media screen and (max-width: 319px) {
  body {
    overflow-x: visible;
  }

  .contents {
    min-width: 320px;
  }

  .contents1800 {
    min-width: 320px;
  }

  header {
    min-width: 320px;
  }

  footer {
    min-width: 320px;
  }
}
.bg {
  background: rgb(237, 210, 222);
  background: linear-gradient(
    90deg,
    rgba(237, 210, 222, 1) 22%,
    rgba(161, 236, 255, 1) 100%
  );
}