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

/* ページ共通___________________________*/
.main-area img {
  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;
}

/* font */
.main-area p,
.main-area h3,
.main-area h4,
.main-area a {
  font-family: "HiraKakuProN-W3", "Hiragino Kaku Gothic ProN W3", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
  letter-spacing: 0.1em;
  line-height: 1.857;
  font-weight: 300;
  text-align: center;
}

.main-area .ff_hiraB {
  font-family: "HiraKakuProN-W6", "Hiragino Kaku Gothic ProN W6", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 600;
}

.main-area .ff_inter {
  font-family: 'Inter', sans-serif;
  font-style: normal;
}

@font-face {
  font-family: "baske";
  src: url("../font/Baskerville-SemiBold-05.ttf") format("truetype");
}

@media screen and (max-width: 767px) {
  .main-area {
    overflow: hidden;
    padding-bottom: calc(125*(100vw / 375));
  }

  .main-area .pcOnly {
    display: none;
  }

  .main-area p {
    font-size: calc(14* (100vw / 375));
  }
}

@media screen and (min-width: 768px) {
  .main-area {
    padding-bottom: 9.7rem;
    overflow-x: hidden;
  }

  .main-area .spOnly {
    display: none;
  }

  .main-area p {
    font-size: 1.4rem;
  }

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

/* ▽ sec__fv ▽ */
.sec__fv {
  background: #131722;
  color: #fff;
  padding-bottom: calc(60*(100vw / 375));
}

.fv_read {
  margin-top: calc(-7*(100vw / 375));
}

.fv_read h3 {
  font-size: calc(20*(100vw / 375));
  line-height: 1.75;
}

.fv_read h3+p {
  font-size: calc(15* (100vw / 375));
  margin: calc(6* (100vw / 375)) 0 0 0;
  line-height: 1.8;
}

.sec__fv .fv_read_info {
  margin: calc(29*(100vw / 375)) auto 0;
  font-size: calc(13*(100vw / 375));
  line-height: 1.74;
  font-weight: 500;
  font-family: "HiraKakuProN-W5", "Hiragino Kaku Gothic ProN W5", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.fv_info {
  width: calc(375*(100vw / 375));
  margin: calc(20*(100vw / 375)) auto 0;
}

.sec__fv .fv_info_tx {
  margin: calc(10*(100vw / 375)) auto 0;
  font-size: calc(12*(100vw / 375));
  line-height: 2;
  font-weight: 500;
  font-family: "HiraKakuProN-W5", "Hiragino Kaku Gothic ProN W5", "Hiragino Sans", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "Helvetica Neue", Helvetica, Arial, sans-serif;
  white-space: nowrap;}

.main-area .pink_ttl {
  font-family: 'Inter', "HiraKakuProN-W3", "Hiragino Kaku Gothic ProN W3", sans-serif;
  color: #F95089;
  text-align: center;
  margin-top: calc(22*(100vw / 375));
  font-weight: 700;
  font-size: calc(15* (100vw /375));
  line-height: 1;
}

@media screen and (min-width: 768px) {
  .sec__fv {
    padding-bottom: 8rem;
  }

  .sec__fv h2 {
    width: 120rem;
    margin: auto;
    padding-top: 2rem;
  }

  .fv_read {
    margin: 5.2rem 0 0 0;
  }

  .fv_read h3 {
    font-size: 2.4rem;
    line-height: 1.8;
    margin-top: -4rem;
  }

  .fv_read h3+p {
    font-size: 1.6rem;
    margin: 1rem 0 0 0;
    line-height: 1.875;
  }

  .sec__fv .fv_read_info {
    margin: 2.5rem auto 0;
    font-size: 1.4rem;
    line-height: 1.72;
    letter-spacing: 0.1em;
  }

  .fv_info {
    width: 100rem;
    margin: 5.6rem auto 0;
  }

  .sec__fv .fv_info_tx {
    margin: 1rem auto 0;
    font-size: 1.2rem;
    line-height: 1.8;
  }

  .main-area .pink_ttl {
    margin-top: 1.8rem;
    font-size: 1.5rem;
    line-height: 1;
  }
}






/* ===============================================
* sale *
=============================================== */
.sale_lp_brand {
  position: relative;
  margin: calc(78*(100vw / 375)) auto 0;
  z-index: 0;
}

.sale_lp_brand__list {
  display: flex;
  flex-wrap: wrap;
  gap: calc(10*(100vw / 375)) 0;
  width: calc(345*(100vw / 375));
  margin: calc(31* (100vw /375)) auto 0;
  justify-content: space-between;
}

.sale_lp_brand__list li {
  width: calc(109*(100vw / 375));
  height: calc(65* (100vw / 375));
  background: #fff;
  flex-shrink: 0;
}

.sale_lp_brand__list li a {
  display: block;
  width: 100%;
  height: 100%;
}

.sale_lp_brand__list img {
  object-fit: cover;
}

.sale_lp_brand__list p {
  display: flex;
  justify-content: center;
  align-items: center;
  height: calc(23 *(100vw / 375));
  font-size: calc(13 *(100vw / 375));
  color: #000;
  font-weight: 600;
  text-align: center;
  background-color: var(--off-rate-color, #990909);
}

.sec__fv .sale_lp__title {
  font-size: calc(20 *(100vw / 375));
  letter-spacing: 0;
  line-height: 1;
}

.sale_lp__title+ul {
  margin-top: calc(29 *(100vw / 375));
}

.ttl {
  text-decoration: seagreen;
}

@media screen and (min-width: 768px) {
  .sale_lp_brand {
    width: 119.5rem;
    margin: 7.4rem auto 0;
  }

  .sale_lp_brand__list {
    width: 100%;
    gap: 2rem 3.5rem;
    margin: 3.6rem auto 0;
    justify-content: flex-start;
  }

  .sale_lp_brand__list li {
    width: 17rem;
    height: 10rem;
  }

  .sale_lp_brand__list li:nth-of-type(n+4) {
    margin-top: 0;
  }

  .sale_lp_brand__list p {
    height: 3.5rem;
    font-size: 1.9rem;
  }

  .sec__fv .sale_lp__title {
    font-size: 2.5rem;
    letter-spacing: 0.1em;
  }

  .sale_lp__title+ul {
    margin-top: 3rem;
  }
}


/* ___________________________*/
.sec__contents>.ff_hiraB {
  text-align: center;
  font-size: calc(20*(100vw / 375));
  line-height: 1.6;
  margin-top: calc(45*(100vw / 375));
}

.sec__contents>.ff_hiraB+.pink_ttl {
  margin-top: calc(17*(100vw / 375));
  margin-bottom: calc(40* (100vw /375));
}

@media screen and (min-width: 768px) {
  .sec__contents>.ff_hiraB {
    font-size: 2.5rem;
    line-height: 1.748;
    margin-top: 9.2rem;
  }

  .sec__contents>.ff_hiraB+.pink_ttl {
    margin-top: 1.3rem;
    margin-bottom: 6.2rem;
  }
}

/* ===============================================
* style1 *
=============================================== */
.gray_bg {
  background: #F2F2F2;
}

.style {
  padding: calc(62*(100vw / 375)) 0 calc(55*(100vw / 375));
}

.style.gray_bg {
  padding: calc(33*(100vw / 375)) 0 calc(40*(100vw / 375));
}

.style_container {
  width: calc(345* (100vw /375));
  margin: auto;
}

.style_container_img {
  margin-top: calc(10* (100vw /375));
}

.style_container_detail_tx {
  position: relative;
  margin-top: calc(52*(100vw / 375));
}

.style_container_detail_tx::before,
.style_container_detail_tx::after {
  position: absolute;
  content: "";
  background: url(../img/svg/frame.svg) center/contain no-repeat;
  width: calc(30* (100vw /375));
  height: calc(30* (100vw /375));
}

.style_container_detail_tx::before {
  top: calc(-20* (100vw /375));
  left: 0;
}

.style_container_detail_tx::after {
  bottom: calc(-20* (100vw /375));
  right: 0;
  transform: scale(-1, -1);
}

.style_container_detail_tx h4 {
  font-family: 'Inter', "HiraKakuProN-W3", "Hiragino Kaku Gothic ProN W3", sans-serif;
  font-weight: 500;
  font-size: calc(16* (100vw /375));
  letter-spacing: 0.1em;
  line-height: 1;
}

.style_container_detail_tx p {
  font-size: calc(13*(100vw / 375));
  line-height: 1.846;
  width: calc(305*(100vw / 375));
  margin: calc(12*(100vw / 375)) auto 0;
  text-align: left;
}

.style_container_detail_credit {
  display: flex;
  flex-direction: column;
  gap: calc(6*(100vw / 375));
  margin-top: calc(39*(100vw / 375));
}

.style_container_detail_credit a {
  position: relative;
  width: 100%;
}

.style_container_detail_credit span {
  font-size: calc(12*(100vw / 375));
  line-height: 1.83;
  font-weight: 300;
  display: block;
  text-align: left;
  letter-spacing: 0.1em;
}

.style_container_detail_credit .item_buy {
  position: absolute;
  top: 50%;
  right: 0;
  width: calc(40*(100vw / 375));
  transform: translateY(-50%);
}

.style .style_container_detail_small {
  font-size: calc(10*(100vw / 375));
  line-height: 1;
  font-weight: 300;
  letter-spacing: 0.1em;
  margin-top: calc(16*(100vw / 375));
}

.style .shop_more_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: calc(345* (100vw /375));
  height: calc(50* (100vw /375));
  background: #131722;
  color: #fff;
  font-size: calc(11*(100vw / 375));
  line-height: 1;
  font-weight: 300;
  letter-spacing: 0.1em;
  margin: calc(40*(100vw / 375)) auto 0;
}

@media screen and (min-width: 768px) {
  .style {
    padding: 8rem 0 8rem;
  }

  .style.gray_bg {
    padding: 8rem 0 8rem;
  }

  .style_ttl {
    position: absolute;
    width: 60rem;
    top: 0rem;
    right: 0;
  }

  .style.gray_bg .style_ttl {
    left: 0;
    right: initial;
  }

  .style_container {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100rem;
  }

  .style.gray_bg .style_container {
    flex-direction: row-reverse;
  }

  .style_container_img {
    margin-top: 0;
    width: 46rem;
  }

  .style_container_detail {
    width: 50rem;
    margin-top: 24.6rem;
  }

  .style_container_detail_tx {
    margin-top: 0;
  }

  .style_container_detail_tx::before,
  .style_container_detail_tx::after {
    width: 5rem;
    height: 5rem;
  }

  .style_container_detail_tx::before {
    top: -4.2rem;
  }

  .style_container_detail_tx::after {
    bottom: -3.4rem;
  }

  .style_container_detail_tx h4 {
    font-size: 1.8rem;
  }

  .style_container_detail_tx p {
    font-size: 1.4rem;
    line-height: 1.857;
    width: 40rem;
    margin: 2rem auto 0;
  }

  .style_container_detail_credit a {
    text-align: right;
    width: fit-content;
    margin-left: auto;
    display: block;
  }

  .style_container_detail_credit {
    gap: 0.5rem;
    margin-top: 6rem;
  }

  .style_container_detail_credit span {
    font-size: 1.4rem;
    line-height: 1.8;
    letter-spacing: 0.1em;
    text-align: right;
    display: inline-block;
  }

  .style_container_detail_credit .item_name {
    white-space: nowrap;
  }

  .style_container_detail_credit .item_price {
    letter-spacing: 0.11em;
    white-space: nowrap;
    margin-left: 1.3rem;
  }

  .style_container_detail_credit .item_buy {
    position: relative;
    width: 4rem;
    top: -0.5rem;
    transform: translateY(0);
    margin-left: 0.4rem;
  }

  .style .style_container_detail_small {
    font-size: 1.2rem;
    margin-top: 0.9rem;
    text-align: right;
  }

  .style .shop_more_btn {
    width: 42rem;
    height: 5rem;
    font-size: 1.3rem;
    margin: 6rem auto 0;
  }
}

/* ===============================================
* style6 *
=============================================== */
@media screen and (min-width: 768px) {
  .style6 .style_container_detail_credit {
    gap: 1.3rem;
  }

  .style6 .style_container_detail_credit a,
  .style7 .style_container_detail_credit a {
    display: flex;
    align-items: center;
    justify-content: end;
  }

  .style6 .style_container_detail_credit .item_name,
  .style7 .style_container_detail_credit .item_name {
    width: 30rem;
    text-align: left;
    line-height: 1.9;
  }
}

/* ===============================================
* style7 *
=============================================== */
@media screen and (min-width: 768px) {
  .style7 .style_container_detail_credit .item_name {
    width: 29rem;
  }

  .style7 .style_container_detail_credit .item_price {
    width: 13rem;
  }
}




























/* ▽ lp__foot_btn ▽ */
.main-area .lp__foot_btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: calc(345* (100vw / 375));
  height: calc(50* (100vw / 375));
  color: #000;
  background: #fff;
  border: 1px solid #000;
  line-height: 1;
  margin: calc(30* (100vw / 375)) auto 0;
  font-size: calc(11* (100vw / 375));
}

@media screen and (min-width: 768px) {
  .main-area .lp__foot_btn {
    width: 42rem;
    height: 5rem;
    margin: 4.7rem auto 0;
    font-size: 1.3rem;
  }
}

@media (max-width: 1366px) and (min-width: 768px) {
  html {
    font-size: calc(10 * (100vw / 1366));
  }
}