@charset "UTF-8";


/* ========================================
   ボタン
======================================== */

.btn_test {
  box-shadow: 10px 10px 0 rgba(0, 0, 0, 0.3);
}


/* ========================================
   カラムの影
======================================== */

.shadow {
  box-shadow:
    -12px 0 10px -8px rgba(51, 51, 51, 0.06),
     12px 0 10px -8px rgba(51, 51, 51, 0.06);
}


/* ========================================
   キャプション
======================================== */

.caption > p:last-child,
.caption2 > p:last-child {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  height: 0 !important;
  line-height: 0 !important;
}

.caption2 {
  -webkit-text-stroke: 2px #02c7cf;
  paint-order: stroke fill;
}


/* ========================================
   商品テキスト
======================================== */

.product_p + p:empty {
  display: none;
}

.product_p {
  margin: 0 !important;
  -webkit-text-stroke: 5px #02c7cf;
  paint-order: stroke fill;
}

.textlink {
  margin-bottom: 0 !important;
}


/* ========================================
   ImageText
======================================== */

.g-ImageTextHP--v2.is-layoutL
.g-ImageTextHP--v2__contentsBlock__image,

.g-ImageTextHP--v2.is-layoutR
.g-ImageTextHP--v2__contentsBlock__image {
  padding: 0;
}


/* ========================================
   PRODUCT 背景
======================================== */

.column_product {
  background-image:
    url("bg_1.png"),
    url("bg_2.png"),
    url("bg_1.png"),
    url("bg_3.png"),
    url("bg_4.png"),
    url("bg_5.png"),
    url("bg_6.png"),
    url("bg_7.png"),
    url("bg_8.png");

  background-repeat:
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

background-position: 
left 10.5%,  
right 25.8%,  
left 41.2%, 
right 13% top 8.5%,  
right 2% top 12%, 
left 15% top 21.5%, 
left 8% top 34.5%, 
right 16% top 35.2%, 
right 15% top 48.5%;


  background-size:
    90%,
    90%,
    90%,
    9%,
    9%,
    9%,
    9%,
    9%,
    9%;
}


/* ========================================
   PRIZE 背景
======================================== */

.column_prize {
  background-image:
    url("bg_11.png"),
    url("bg_12.png"),
    url("bg_13.png"),
    url("bg_14.png");

  background-repeat:
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

  background-position:
    center top 16%,  /* bg_11 */
    center top 39%,  /* bg_12 */
    center top 67%,  /* bg_13 */
    center top 90%;  /* bg_14 */

  background-size:
    100%,
    100%,
    100%,
    100%;
}


/* ========================================
   APPLY 1
======================================== */

.column_apply1 {
  background-image: url("bg_15.png");
  background-repeat: no-repeat;
  background-position: right -1% top 19%;
  background-size: 22%;
}


/* ========================================
   APPLY 2
======================================== */

.column_apply2 {
  background-image: url("bg_16.png");
  background-repeat: no-repeat;
  background-position: left -1% top 95%;
  background-size: 36%;
}


/* ========================================
   スマホ
   ～640px
======================================== */

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

  .product_p {
    font-size: 0.9em;
  }

}


/* ========================================
   タブレット
   641px ～ 1024px
======================================== */

@media screen and (min-width: 641px) and (max-width: 1024px) {

  .product_p {
    font-size: 0.7em;
  }

  .column_product {
    background-position:
left 10%,              /* bg_1 */
      right 25.5%,            /* bg_2 */
      left 41%,             /* bg_1 */
      right 4% top 11%,     /* bg_3 */
      right 2% top 14%,     /* bg_4 */
      left 15% top 21%,     /* bg_5 */
      left 8% top 34.5%,    /* bg_6 */
      right 3% top 35.5%,  /* bg_7 */
      right 15% top 49.5%;
  }

}


/* ========================================
   PC
   1025px～
======================================== */

@media screen and (min-width: 1025px) {

  .product_p {
    font-size: 1em;
  }

  .column_product {
    background-position:
left 11%,  
right 26%,  
left 41.5%, 
right 10% top 9.5%,
right 2% top 15%, 
left 15% top 22.5%, 
left 8% top 35.5%, 
right 16% top 36%, 
right 15% top 48.5%;
  }

}

/* ========================================
   共通
======================================== */

#common_section_wrapper_1 {
  position: relative;
  z-index: 0;
  background: none;
}

/* スマホでは背景・ロゴなし */
#common_section_wrapper_1::before,
#common_section_wrapper_1::after {
  content: none;
}


/* ========================================
   タブレット
   641px ～ 1024px
======================================== */

@media screen and (min-width: 641px) and (max-width: 1024px) {

  #common_section_wrapper_1::after {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url("bg_md.jpg");
    background-size: 100% auto;
    background-position: center top;
    background-repeat: repeat-y;

    z-index: 0;
    pointer-events: none;
  }
}

/* ========================================
   PC
   1024px ～ 1260px
======================================== */

@media screen and (min-width: 1024px) and (max-width: 1260px) {

  #common_section_wrapper_1::after {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url("bg_pc_3.png");
    background-size: 100%;
    background-position: center top;
    background-repeat: repeat;

    z-index: 0;
    pointer-events: none;
  }
}



/* ========================================
   PC
   1260px ～ 1599px
======================================== */

@media screen and (min-width: 1260px) and (max-width: 1599px) {

  #common_section_wrapper_1::after {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url("bg_pc.png");
    background-size: 100%;
    background-position: center top;
    background-repeat: repeat;

    z-index: 0;
    pointer-events: none;
  }
}


/* ========================================
   PC
   1600px ～ 1999px
======================================== */

@media screen and (min-width: 1600px) and (max-width: 1999px) {

  #common_section_wrapper_1::after {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url("bg_pc_1.png");
    background-size: 100%;
    background-position: center top;
    background-repeat: repeat;

    z-index: 0;
    pointer-events: none;
  }
}


/* ========================================
   PC
   2000px～
======================================== */

@media screen and (min-width: 2000px) {

  #common_section_wrapper_1::after {
    content: "";
    position: fixed;
    inset: 0;

    background-image: url("bg_pc_2.png");
    background-size: 100%;
    background-position: center top;
    background-repeat: repeat;

    z-index: 0;
    pointer-events: none;
  }
}


/* ========================================
   wrapper内のカラムを背景より前へ
======================================== */

@media screen and (min-width: 641px) {

  #common_section_wrapper_1 > * {
    position: relative;
    z-index: 1;
  }


  /* 固定ロゴ */
  #common_section_wrapper_1::before {
    content: "";
    position: fixed;

    left: 8vw;
    top: 250px;

    width: 20vw;
    height: 150px;

    background-image: url("logo.png");
    background-repeat: no-repeat;
    background-position: left top;
    background-size: contain;

    z-index: 500;
    pointer-events: none;
  }
}


/* ========================================
   タブレット時のロゴ調整
   641px ～ 1024px
======================================== */

@media screen and (min-width: 641px) and (max-width: 1024px) {

  #common_section_wrapper_1::before {
    left: 4vw;
    top: 220px;

    width: 24vw;
    height: 180px;
  }

}

/* ========================================
   フッターを固定背景より前へ
======================================== */

footer {
  position: relative;
  z-index: 1000;
}
/* ========================================
   規約まわり
======================================== */
#kiyaku p.cmn-richtext,
#kiyakuX p.cmn-richtext{
  	font-size:90%;
  	line-height:1.6em;
}


#hanbaiten,
#hanbaiten *,
#hanbaiten2,
#hanbaiten2 *,
#toiawaseChuushaku,
#toiawaseChuushaku *,
#toiawaseChuushaku2,
#toiawaseChuushaku2 * {
    line-height: 1.2em !important;
}