@charset "UTF-8";
html {
  font-size: 62.5%;
  font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
  word-wrap: break-word; }

body {
  font-size: 1.4rem;
  margin: 0;
  padding: 0; }
  @media only screen and (min-width: 750px) {
    body {
      font-size: 1.6rem; } }

*,
*::before,
*::after {
  box-sizing: border-box; }

h1, h2, h3, div, p, ul, li {
  margin: 0;
  padding: 0; }

li {
  list-style: none; }

img {
  width: 100%;
  height: auto;
  line-height: 0;
  vertical-align: bottom; }

a:hover {
  opacity: 0.8; }

.only_pc {
  display: none; }
  @media only screen and (min-width: 750px) {
    .only_pc {
      display: inline; } }

.only_sp {
  display: inline; }
  @media only screen and (min-width: 750px) {
    .only_sp {
      display: none; } }

@media only screen and (min-width: 960px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none; } }

@media only screen and (min-width: 420px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none; } }
.header {
  width: 100%;
  height: 11.6vw;
  margin: 0 auto; }
  @media only screen and (min-width: 750px) {
    .header {
      height: calc(105/950 * 100vw); } }
  @media only screen and (min-width: 960px) {
    .header {
      width: 950px;
      height: 105px; } }
  .header .logo {
    width: 15.3125vw;
    padding: 2.5vw 0 0 4.687vw;
    margin: 0;
    box-sizing: content-box; }
    @media only screen and (min-width: 750px) {
      .header .logo {
        width: calc(121/950 * 100vw);
        padding: calc(26/950 * 100vw) 0 0 calc(38/950 * 100vw); } }
    @media only screen and (min-width: 960px) {
      .header .logo {
        width: 121px;
        padding: 26px 0 0 38px; } }
    .header .logo img {
      width: 100%; }

.cont01 {
  width: 100%;
  background-image: url("../img/bg_wave_b_sp.png"), url("../img/bg_wave_t_sp.png"), url("../img/bg01_sp.jpg");
  background-repeat: no-repeat,no-repeat,no-repeat;
  background-position: top center, bottom center, top center;
  background-size: 100% auto,100% auto,cover;
  margin: 0 auto;
  padding: 6.4vw 0 22vw 0; }
  @media only screen and (min-width: 750px) {
    .cont01 {
      background-image: url("../img/bg_wave_b_pc.png"), url("../img/bg_wave_t_pc.png"), url("../img/bg01_pc.jpg");
      padding: calc(46/950 * 100vw) 0 calc(147/950 * 100vw); } }
  @media only screen and (min-width: 960px) {
    .cont01 {
      background-image: url("../img/bg_wave_b_pcl.png"), url("../img/bg_wave_t_pcl.png"), url("../img/bg01_pcl.jpg");
      background-size: auto auto,auto auto,auto auto;
      background-repeat: repeat-x, repeat-x,no-repeat;
      padding: 46px 0 147px 0; } }
  .cont01 .mv {
    position: relative;
    width: 100%;
    margin: 0 auto; }
    @media only screen and (min-width: 960px) {
      .cont01 .mv {
        width: 950px; } }
    .cont01 .mv .close_glay {
      position: absolute;
      display: flex;
      align-items: center;
      justify-content: center;
      z-index: 100;
      width: 90%;
      height: 25vw;
      background-color: rgba(0, 0, 0, 0.75);
      top: 33%;
      left: 50%;
      transform: translateX(-50%) translateY(-50%);
      z-index: 150; }
      @media only screen and (min-width: 750px) {
        .cont01 .mv .close_glay {
          width: calc(900/1040 * 100%);
          height: calc(200/1040 * 100vw);
          top: 46%; } }
      @media only screen and (min-width: 960px) {
        .cont01 .mv .close_glay {
          width: 900px;
          height: 200px; } }
    .cont01 .mv .close_comment {
      width: 80%;
      max-width: 850px;
      filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 0.8)); }
    .cont01 .mv .mv_lead {
      width: 76.266vw;
      margin: 5.866vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont01 .mv .mv_lead {
          width: calc(0/950 * 100vw);
          margin: calc(0/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont01 .mv .mv_lead {
          width: 772px;
          margin: 0px auto 0; } }
    .cont01 .mv .mv_period {
      width: 84.933vw;
      margin: 4.266vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont01 .mv .mv_period {
          width: calc(654/950 * 100vw);
          margin: calc(20/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont01 .mv .mv_period {
          width: 654px;
          margin: 20px auto 0; } }
  .cont01 .prize {
    width: 100%;
    margin: 16.4vw auto 0; }
    @media only screen and (min-width: 750px) {
      .cont01 .prize {
        margin: calc(105/950 * 100vw) auto 0; } }
    @media only screen and (min-width: 960px) {
      .cont01 .prize {
        width: 950px;
        margin: 105px auto 0; } }
    .cont01 .prize .prize_ti {
      width: 77.466vw;
      margin: 0 auto; }
      @media only screen and (min-width: 750px) {
        .cont01 .prize .prize_ti {
          width: calc(467/950 * 100vw); } }
      @media only screen and (min-width: 960px) {
        .cont01 .prize .prize_ti {
          width: 467px; } }
    .cont01 .prize .prize01 {
      width: 89.066vw;
      margin: 7.066vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont01 .prize .prize01 {
          width: calc(655/950 * 100vw);
          margin: calc(37/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont01 .prize .prize01 {
          width: 655px;
          margin: 37px auto 0; } }
    .cont01 .prize .prize02 {
      width: 89.066vw;
      margin: 3.2vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont01 .prize .prize02 {
          width: calc(655/950 * 100vw);
          margin: calc(27/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont01 .prize .prize02 {
          width: 655px;
          margin: 27px auto 0; } }
    .cont01 .prize .prize03 {
      width: 86.933vw;
      margin: 4.533vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont01 .prize .prize03 {
          width: calc(652/950 * 100vw);
          margin: calc(27/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont01 .prize .prize03 {
          width: 652px;
          margin: 27px auto 0; } }

.prod_wrap {
  width: 100%;
  background: #FFF;
  margin: 0; }
  .prod_wrap .prod {
    position: relative;
    width: 100%;
    background: #FFF;
    margin: 0 auto;
    padding: 9.333vw 0 0; }
    @media only screen and (min-width: 750px) {
      .prod_wrap .prod {
        padding: calc(67/950 * 100vw) 0 calc(22/950 * 100vw); } }
    @media only screen and (min-width: 960px) {
      .prod_wrap .prod {
        width: 960px;
        padding: 67px 0 22px; } }
    .prod_wrap .prod .prod_ti {
      position: absolute;
      width: 77.466vw;
      margin: auto;
      top: -7.866vw;
      left: 0;
      right: 0; }
      @media only screen and (min-width: 750px) {
        .prod_wrap .prod .prod_ti {
          width: calc(467/950 * 100vw);
          top: calc(-56/950 * 100vw); } }
      @media only screen and (min-width: 960px) {
        .prod_wrap .prod .prod_ti {
          width: 467px;
          top: -56px; } }
    .prod_wrap .prod .prod_ph {
      width: 100%; }
    .prod_wrap .prod .note {
      text-align: center;
      color: #4b4493;
      font-size: 2.133vw;
      margin-top: 6.666vw; }
      @media only screen and (min-width: 750px) {
        .prod_wrap .prod .note {
          font-size: calc(16/950 * 100vw);
          margin-top: calc(44/950 * 100vw); } }
      @media only screen and (min-width: 960px) {
        .prod_wrap .prod .note {
          font-size: 1.6rem;
          margin-top: 44px; } }

.cont02 {
  width: 100%;
  background-image: url("../img/bg_wave_b_sp.png"), url("../img/bg_wave_t_sp.png"), url("../img/bg02_sp.jpg");
  background-repeat: no-repeat,no-repeat,no-repeat;
  background-position: top center, bottom center, top center;
  background-size: 100% auto,100% auto,cover;
  margin: 0 auto;
  padding: 20vw 0 15.333vw 0; }
  @media only screen and (min-width: 750px) {
    .cont02 {
      background-image: url("../img/bg_wave_b_pc.png"), url("../img/bg_wave_t_pc.png"), url("../img/bg02_pc.jpg");
      padding: calc(138/950 * 100vw) 0 calc(103/950 * 100vw); } }
  @media only screen and (min-width: 960px) {
    .cont02 {
      background-image: url("../img/bg_wave_b_pcl.png"), url("../img/bg_wave_t_pcl.png"), url("../img/bg02_pcl.jpg");
      background-size: auto auto,auto auto,auto auto;
      background-repeat: repeat-x, repeat-x,no-repeat;
      padding: 138px 0 103px 0; } }
  .cont02 .method {
    width: 100%;
    margin: 0 auto; }
    @media only screen and (min-width: 960px) {
      .cont02 .method {
        width: 960px; } }
    .cont02 .method .method_ti {
      width: 77.466%;
      margin: auto; }
      @media only screen and (min-width: 750px) {
        .cont02 .method .method_ti {
          width: calc(467/950 * 100%); } }
      @media only screen and (min-width: 960px) {
        .cont02 .method .method_ti {
          width: 467px; } }
    .cont02 .method .step {
      width: 59.733%;
      margin: 6.4vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont02 .method .step {
          width: calc(836/950 * 100%);
          margin: calc(45/950 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont02 .method .step {
          width: 836px;
          margin: 45px auto 0; } }
  .cont02 .rule_wrap {
    width: 100%;
    margin: 19vw auto 0; }
    @media only screen and (min-width: 750px) {
      .cont02 .rule_wrap {
        margin: calc(100/950 * 100vw) auto 0; } }
    @media only screen and (min-width: 960px) {
      .cont02 .rule_wrap {
        width: 960px;
        margin: 100px auto 0; } }
    .cont02 .rule_wrap .rule_ti {
      width: 77.466%;
      margin: 0 auto; }
      @media only screen and (min-width: 750px) {
        .cont02 .rule_wrap .rule_ti {
          width: calc(467/950 * 100%); } }
      @media only screen and (min-width: 960px) {
        .cont02 .rule_wrap .rule_ti {
          width: 467px; } }
    .cont02 .rule_wrap .rule {
      width: 82vw;
      background: #FFF;
      padding: 1.5em 1.5em;
      overflow-y: scroll;
      height: 47.466vw;
      margin: 5.866vw auto 0; }
      @media only screen and (min-width: 750px) {
        .cont02 .rule_wrap .rule {
          width: calc(912/950 * 100vw);
          height: calc(445/960 * 100vw);
          margin: calc(20/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .cont02 .rule_wrap .rule {
          width: 912px;
          height: 445px;
          margin: 20px auto 0;
          padding: 2em 2.5em; } }
      .cont02 .rule_wrap .rule p {
        font-size: 2.5vw;
        line-height: 1.5em; }
        @media only screen and (min-width: 750px) {
          .cont02 .rule_wrap .rule p {
            font-size: calc(14/960 * 100vw); } }
        @media only screen and (min-width: 960px) {
          .cont02 .rule_wrap .rule p {
            font-size: 1.4rem; } }
      .cont02 .rule_wrap .rule .shop span {
        display: inline-block; }
      .cont02 .rule_wrap .rule h3 {
        font-size: 3.2vw;
        text-align: left;
        border-bottom: solid 1px #000;
        padding: 0em 0em 0.2em;
        margin-top: 2em; }
        @media only screen and (min-width: 750px) {
          .cont02 .rule_wrap .rule h3 {
            font-size: calc(16/960 * 100vw); } }
        @media only screen and (min-width: 960px) {
          .cont02 .rule_wrap .rule h3 {
            font-size: 1.6rem; } }
      .cont02 .rule_wrap .rule h3 + h4 {
        margin-top: 1em; }
      .cont02 .rule_wrap .rule h3:first-child {
        margin-top: 0; }
      .cont02 .rule_wrap .rule h4 {
        font-size: 3vw;
        margin: 1.5em 0 0 0;
        font-weight: bold; }
        @media only screen and (min-width: 750px) {
          .cont02 .rule_wrap .rule h4 {
            font-size: calc(14/960 * 100vw); } }
        @media only screen and (min-width: 960px) {
          .cont02 .rule_wrap .rule h4 {
            font-size: 1.4rem; } }
      .cont02 .rule_wrap .rule h5 {
        font-size: 3vw;
        font-weight: bold;
        margin: 1em 0 0 0; }
        @media only screen and (min-width: 750px) {
          .cont02 .rule_wrap .rule h5 {
            font-size: calc(14/960 * 100vw); } }
        @media only screen and (min-width: 960px) {
          .cont02 .rule_wrap .rule h5 {
            font-size: 1.4rem; } }
      .cont02 .rule_wrap .rule h4 + p, .cont02 .rule_wrap .rule h5 + ol {
        margin-top: 0.3em; }
      .cont02 .rule_wrap .rule h3 + p, .cont02 .rule_wrap .rule h3 + ul, .cont02 .rule_wrap .rule ol + p {
        margin-top: 1em; }
      .cont02 .rule_wrap .rule ul + ul {
        margin-top: 2em; }
      .cont02 .rule_wrap .rule p + p {
        margin-top: 0.5em; }
      .cont02 .rule_wrap .rule .number {
        padding-left: 0;
        margin-top: 0.3em; }
        .cont02 .rule_wrap .rule .number li {
          text-indent: -1em;
          font-size: 2.5vw;
          margin-top: 0.5em;
          line-height: 1.5em;
          padding-left: 1em; }
          @media only screen and (min-width: 750px) {
            .cont02 .rule_wrap .rule .number li {
              font-size: calc(14/960 * 100vw); } }
          @media only screen and (min-width: 960px) {
            .cont02 .rule_wrap .rule .number li {
              font-size: 1.4rem; } }
      .cont02 .rule_wrap .rule .number02 {
        margin-top: 0; }
        .cont02 .rule_wrap .rule .number02 li {
          text-indent: -3em;
          font-size: 2.5vw;
          margin-top: 0em;
          line-height: 1.5em;
          padding-left: 3em; }
          @media only screen and (min-width: 750px) {
            .cont02 .rule_wrap .rule .number02 li {
              font-size: calc(14/960 * 100vw); } }
          @media only screen and (min-width: 960px) {
            .cont02 .rule_wrap .rule .number02 li {
              font-size: 1.4rem; } }
      .cont02 .rule_wrap .rule h4 + .number {
        margin-top: 0.3em; }
      .cont02 .rule_wrap .rule .mt2 {
        margin-top: 2em; }
      .cont02 .rule_wrap .rule .note {
        margin-top: 0.5em;
        margin-left: 1em;
        text-indent: -1em; }
      .cont02 .rule_wrap .rule ul {
        padding: 0 0 0 0.3em;
        margin-top: 0.5em; }
        .cont02 .rule_wrap .rule ul li {
          list-style: disc;
          margin-left: 1em;
          margin-top: 0.3em;
          font-size: 2.5vw;
          line-height: 1.5em; }
          @media only screen and (min-width: 750px) {
            .cont02 .rule_wrap .rule ul li {
              font-size: calc(14/960 * 100vw); } }
          @media only screen and (min-width: 960px) {
            .cont02 .rule_wrap .rule ul li {
              font-size: 1.4rem; } }

.account {
  width: 84.533%;
  margin: 7.066vw auto 0; }
  @media only screen and (min-width: 750px) {
    .account {
      width: calc(715/960 * 100%);
      margin: calc(72/960 * 100%) auto 0; } }
  @media only screen and (min-width: 960px) {
    .account {
      width: 715px;
      margin: 72px auto 0; } }
  .account a:hover {
    opacity: 1 !important;
    filter: saturate(158%); }

.desert {
  width: 100%;
  margin: 25.733vw auto 0; }
  @media only screen and (min-width: 750px) {
    .desert {
      margin: calc(212/960 * 100%) auto 0; } }
  @media only screen and (min-width: 960px) {
    .desert {
      width: 960px;
      margin: 212px auto 0; } }
  .desert .desert_ti {
    width: 70.266vw;
    margin: 0vw auto 0; }
    @media only screen and (min-width: 750px) {
      .desert .desert_ti {
        width: calc(527/960 * 100%); } }
    @media only screen and (min-width: 960px) {
      .desert .desert_ti {
        width: 527px; } }
  .desert .desert_text {
    width: 78.666%;
    margin: 6vw auto 0; }
    @media only screen and (min-width: 750px) {
      .desert .desert_text {
        width: calc(626/960 * 100%);
        margin: calc(63/960 * 100vw) auto 0; } }
    @media only screen and (min-width: 960px) {
      .desert .desert_text {
        width: 626px;
        margin: 63px auto 0; } }
  .desert .desert_movie {
    width: 87.2%;
    margin: 2.4vw auto 0;
    aspect-ratio: 16 / 9;
    border: solid 3px #FFF;
    border-radius: 3.2vw;
    overflow: hidden;
    background: #FFF; }
    @media only screen and (min-width: 750px) {
      .desert .desert_movie {
        width: calc(820/960 * 100%);
        margin: calc(20/960 * 100vw) auto 0;
        border-radius: calc(30/960 * 100vw); } }
    @media only screen and (min-width: 960px) {
      .desert .desert_movie {
        width: 820px;
        margin: 20px auto 0;
        border-radius: 30px; } }
    .desert .desert_movie video {
      width: 100%;
      height: 100%; }
  .desert .ban_md {
    width: 33.733vw;
    margin: 6vw auto 0;
    line-height: 1em; }
    @media only screen and (min-width: 750px) {
      .desert .ban_md {
        width: calc(267/960 * 100vw);
        margin: calc(54/960 * 100vw) auto 0; } }
    @media only screen and (min-width: 960px) {
      .desert .ban_md {
        width: 267px;
        margin: 54px auto 0; } }
  .desert .ban {
    width: 86.666%;
    margin: 2vw auto 0; }
    @media only screen and (min-width: 750px) {
      .desert .ban {
        width: calc(809/960 * 100%);
        margin: calc(17/960 * 100vw) auto 0; } }
    @media only screen and (min-width: 960px) {
      .desert .ban {
        width: 809px;
        margin: 17px auto 0; } }
    .desert .ban a:hover {
      opacity: 1 !important;
      filter: saturate(158%); }

.inquiry {
  width: 100%;
  background-image: url("../img/bg_wave_grade_sp.png");
  background-size: 100% auto;
  background-position: bottom center;
  background-repeat: no-repeat;
  padding: 8vw 0 15vw 0; }
  @media only screen and (min-width: 750px) {
    .inquiry {
      background-image: url("../img/bg_wave_grade_pc.png");
      padding: calc(52/960 * 100vw) 0 calc(120/960 * 100vw) 0; } }
  @media only screen and (min-width: 960px) {
    .inquiry {
      background-image: url("../img/bg_wave_grade_pcl.png");
      background-size: auto auto;
      padding: 52px 0 120px 0; } }
  .inquiry--inner {
    width: 100%;
    margin: 0 auto; }
    @media only screen and (min-width: 750px) {
      .inquiry--inner {
        width: calc(960/960 * 100%); } }
    @media only screen and (min-width: 960px) {
      .inquiry--inner {
        width: 960px; } }
    .inquiry--inner h2 {
      width: 95.733%;
      margin: 0 auto 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner h2 {
          width: calc(878/960 * 100%); } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner h2 {
          width: 878px; } }
    .inquiry--inner .inquiry_name {
      width: 87.2%;
      margin: 4vw auto 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner .inquiry_name {
          width: calc(599/960 * 100%);
          margin: calc(30/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner .inquiry_name {
          width: 599px;
          margin: 30px auto 0; } }
    .inquiry--inner .freecall {
      display: block;
      width: 43.2vw;
      margin: 1.6vw auto 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner .freecall {
          width: calc(296/960 * 100%);
          margin: calc(12/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner .freecall {
          width: 296px;
          margin: 12px auto 0; } }
    .inquiry--inner .recept {
      width: 83.333%;
      margin: 2.266vw auto 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner .recept {
          width: calc(834/960 * 100%);
          margin: calc(14/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner .recept {
          width: 834px;
          margin: 14px auto 0; } }
    .inquiry--inner .dot {
      width: 95.733%;
      margin: 5.333vw auto 0;
      line-height: 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner .dot {
          width: calc(878/960 * 100%);
          margin: calc(42/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner .dot {
          width: 878px;
          margin: 42px auto 0; } }
    .inquiry--inner .bt {
      width: 64%;
      margin: 5.333vw auto 0; }
      @media only screen and (min-width: 750px) {
        .inquiry--inner .bt {
          width: calc(740/960 * 100%);
          margin: calc(62/960 * 100vw) auto 0; } }
      @media only screen and (min-width: 960px) {
        .inquiry--inner .bt {
          width: 740px;
          margin: 62px auto 0; } }

.fix_bt {
  position: fixed;
  bottom: 3vw;
  right: 2vw;
  width: 17.733vw; }
  @media only screen and (min-width: 750px) {
    .fix_bt {
      width: calc(122/960 * 100vw);
      bottom: calc(15/960 * 100vw);
      right: calc(15/960 * 100vw); } }
  @media only screen and (min-width: 960px) {
    .fix_bt {
      width: 122px;
      bottom: 15px;
      right: 15px; } }
  .fix_bt a {
    display: block; }
  .fix_bt a + a {
    margin-top: 2.5vw; }
    @media only screen and (min-width: 750px) {
      .fix_bt a + a {
        margin-top: calc(13/960 * 100vw); } }
    @media only screen and (min-width: 960px) {
      .fix_bt a + a {
        margin-top: 13px; } }
