/* パンくず 追加スタイル PC */
@media only screen and (min-width: 768px) {
  .breadcrumb__list {
    padding-bottom: 1.6rem;
  }
}

/* ページ共通___________________________*/

.red-mood-style_251212{
  --font-times: "times-new-roman", sans-serif;
  --font-aktiv: "aktiv-grotesk", sans-serif;
  --font-noto: "Noto Sans JP", sans-serif;
  --fw-regular: 400;
  --fw-medium: 500;
  --color-red: #9A171B;
  --color-black: #140909;
  --color-white: #FFFFFF;

  font-style: normal;
  font-weight: var(--fw-regular);

  /*デザインの値*/
  --pc-width: 1400; /*PCデザイン幅*/
  --sp-width: 375; /*SPデザイン幅*/
  --pc-artboard-width: 450; /*SP共通デザイン幅*/
  --sp-artboard-width: 375; /*PC共通デザイン幅*/
  /*可変率の計算式*/
  --formula: calc(var(--variable) * var(--ratio)); /*SP,PC共通箇所の可変割合の計算式*/
  --formula_pc: calc(var(--variable) * 1); /*PCデザインの可変割合の計算式*/

  font-family: var(--font-courier-std);
  font-weight: var(--fw-medium);
  color: var(--color-black);
  letter-spacing: 0.08em;
  font-style: normal;
  overflow-x: clip;
}

/* PC画面幅 2100px以上 固定 */
@media (min-width: 2101px) {
  .red-mood-style_251212 {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比率 */
    --variable: 1px; /* 固定値（可変しない） */
  }
}
/* PC画面幅 768～2100px 可変 */
@media (min-width: 768px) and (max-width: 2100px) {
  .red-mood-style_251212 {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width)); /* PCとSPのデザイン幅の比率 */
    --variable: calc(100vw / var(--pc-width)); /* 画面幅に基づく可変値 */
  }
}
/* SP画面幅 767px以下 可変 */
@media (max-width: 767px) {
  .red-mood-style_251212 {
    --ratio: 1; /* 比率は1（変わらない） */
    --variable: calc(100vw / var(--sp-width)); /* 画面幅に基づく可変値 */
  }
}

.main-area img,
.main-area picture {
  width: 100%;
  height: auto;
}

.main-area a,
.main-area picture,
.main-area span {
  display: inline-block;
}

/* .main-area .lp_underline {
  position: relative;
  display: inline-block
}

.main-area .lp_underline::before {
  content: "";
  position: absolute;
  background: #f7f7f7;
  z-index: -1;
} */

.main-area a {
  transition: all .3s;
}

.mv_wrapper{
  width: 100%;
}

/* ===============================================
* main_container *
=============================================== */

.main_container{
  background-color: var(--color-white);
  overflow-x: clip;
  padding-bottom: calc(80 * var(--formula));
}

.fv_txt{
  text-align: center;
  font-size: calc(14 * var(--formula));
  letter-spacing: 0.08em;
  line-height: 2;
  padding: calc(60 * var(--formula)) 0;
  border-bottom: var(--color-red) solid 2px;
}

.style{
  padding: calc(60 * var(--formula)) 0;
  border-bottom: var(--color-red) solid 2px;
}

.style05{
  border: none;
}

.style_ttl{
  font-family: var(--font-times);
  font-weight: var(--fw-regular);
  font-size: calc(54 * var(--formula));
  letter-spacing: 0.08em;
  text-align: center;
  color: var(--color-red);
  margin-bottom: calc(20 * var(--formula));
}

.style_ttl .style-txt{
  display: block;
  font-size: calc(20 * var(--formula));
  line-height: 1.2;
  letter-spacing: 0.08em;
}

.style_ttl .number{
  letter-spacing: 0.08em;
}

.brand_img{
  margin: 0 auto calc(30 * var(--formula));
}

.norc_img{
  width: calc(120 * var(--formula));
}

.ellegirl_img{
  width: calc(119.89 * var(--formula));
}

.lesouk_img{
  width: calc(120 * var(--formula));
}

.crossfunction_img{
  width: calc(90.32 * var(--formula));
}

.style_slider,
.style_img,
.img_layout_wrapper{
  margin-bottom: calc(20 * var(--formula));
}

.img_layout_wrapper{
  display: grid;
  grid-template-columns: calc(160 * var(--formula)) calc(55 * var(--formula)) auto;
  grid-template-rows: calc(200 * var(--formula)) calc(75 * var(--formula)) auto;
}

.img_small01{
  position: relative;
  z-index: 1;
  width: calc(215 * var(--formula));
  grid-column: 1 / 3;
  grid-row: 1 / 3;
}

.img_small02{
  width: calc(215 * var(--formula));
  grid-column: 2 / 4;
  grid-row: 2 / 4;
}

.style04 .img_small01{
  grid-column: 1 / 3;
  grid-row: 2 / 4;

}

.style04 .img_small02{
  grid-column: 2 / 4;
  grid-row: 1 / 3;
}

.credit_wrapper{
  display: flex;
  flex-direction: column;
  justify-content: left;
  row-gap: calc(10 * var(--formula));
  margin: 0 calc(15 * var(--formula)) 0 0;
}

.credit_item{
  display: flex;
  align-items: center;
  justify-content: end;
  column-gap: calc(7 * var(--formula));
  font-size: calc(13 * var(--formula));
  font-family: var(--font-aktiv);
  line-height: 1.5;
  letter-spacing: 0.08em;
}

.credit_item .digit_adjust span{
  padding-left: calc(18 * var(--formula));
}

.style03 .credit_item .digit_adjust span,
.style05 .credit_item .digit_adjust span{
  padding-left: calc(13 * var(--formula));
}

.credit_item span{
  padding-left: calc(10 * var(--formula));
}

.credit_item .buy_btn{
  color: var(--color-white);
  background-color: var(--color-red);
}

.credit_item .buy_btn a{
  padding: calc(1 * var(--formula)) calc(4 * var(--formula)) 0;
}

@media screen and (min-width: 768px) {
  .main-area{
    background-color: var(--color-red);
  }

  .main_container{
    width: calc(450 * var(--formula_pc));
    margin: 0 auto
  }

  .fv_txt{
    font-size: calc(15 * var(--formula_pc));
  }
}


/* ===============================================
* splide *
=============================================== */
.content-box--pagination-under .splide__pagination {
  justify-content: flex-start;
  margin: calc(10 * var(--formula)) 0 0 calc(15 * var(--formula));
}

.splide__pagination li{
  margin-right: calc(8 * var(--formula));
}

.splide__pagination li button.is-active{
  background-color: var(--color-red);
}

.splide__pagination li button{
  width: calc(8 * var(--formula));
  height: calc(8 * var(--formula));
  border: 1px solid var(--color-red);
  border-radius: 50%;
  background: white;
  padding: 0;
}

/* ▽ lp__foot_btn ▽ */
.main-area .lp__foot_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-noto);
  font-size: calc(14* var(--formula));
  line-height: 1.2857142857;
  letter-spacing: 0.05em;
  width: calc(300* var(--formula));
  height: calc(50* var(--formula));
  margin-right: auto;
  margin-left: auto;
}

.main-area .lp__foot_btn.--01{
  color: var(--color-red);
  border: 1px solid var(--color-red);
  margin-bottom:  calc(20* var(--formula));
}

.main-area .lp__foot_btn.--02{
  color: var(--color-white);
  background-color: var(--color-red);
  /* margin-bottom:  calc(80* var(--formula)); */
}