@charset "utf-8";

/* pr-nyon-styling-25
-------------------------------------------------- */

/* ----------------------------------------
  ページ全体
---------------------------------------- */
.pr-nyon-styling-25 {
  margin: 0 auto;
  font-family: "Bodoni Moda", "Noto Sans JP", serif;
  font-weight: 300;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: 0;
  color: #242B33;
}

/* ----------------------------------------
  既存CSS調整
---------------------------------------- */
.pr-nyon-styling-25 hr {
    margin-top: 0; /* 既存css(bootstrap.min.css)打ち消し用 */
    margin-bottom: 0;
    border-top: 1px solid #d8dbde;
}

/* 既存css(fracta_pages.css)打ち消し用 */
html body .pr-nyon-styling-25 a:hover img {
    opacity: 1;
}
/* 既存css(fracta_pages.css)打ち消し用 */
.fr_page-blog-detail .fr_blog-detail-mainArea .pr-nyon-styling-25 a {
    color: #082d39;
    text-decoration: none;
}
.pr-nyon-styling-25 a:hover img {
  opacity: 0.7 !important; /* fracta_base.css打ち消し用 */
}
/* 既存css(bootstrap.min.css,fracta_pages.css)  打ち消し用
 ※見出し下日付pタグ.ffr_page-contents-detail-postdate」の既存marginは他ページ共通のため残す*/
.pr-nyon-styling-25 h2, h3, p:not(.fr_page-contents-detail-postdate), ul {
  margin: 0;
}
/* 既存css(fracta_pages.css）打ち消し用 */
.pr-nyon-styling-25  a {
  text-decoration: none !important;
}

/* ----------------------------------------
  セクション
---------------------------------------- */
.pr-nyon-styling-25 section.section {
  padding: 60px 0 80px;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 section.section {
    padding: 50px 0 75px;
  }
}
.pr-nyon-styling-25 section.index-01 {
  background-color: #FCF9F2;
}
.pr-nyon-styling-25 section.index-03 {
  background-color: #FDF6FB;
}
.pr-nyon-styling-25 section.index-05 {
  background-color: #F1F4F8;
}
.pr-nyon-styling-25 section.product-section {
  padding: 60px 0 0;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 section.product-section {
    padding: 40px 0 0;
  }
}
/* ----------------------------------------
  見出し
---------------------------------------- */
.pr-nyon-styling-25 h2.index-heading,
.pr-nyon-styling-25 h2.heading,
.pr-nyon-styling-25 h3.sub-heading {
  font-family: "Bodoni Moda", serif;
  font-weight: 400;
}

.pr-nyon-styling-25 h2.index-heading {
  font-size: 30px;
  line-height: 0.9;
  color: #242B33;
  text-align: center;
  margin-bottom: 40px;
  text-transform: uppercase;
}

.heading-group {
  margin-bottom: 40px;
}

.pr-nyon-styling-25 h2.heading,
.pr-nyon-styling-25 p.heading-num {
   font-size: 30px;
   line-height: 1.3;
   text-align: center;
}

/* 各セクションナンバー用カラー */
.pr-nyon-styling-25 p.heading-num--01 {
  color: #976F09;
}
.pr-nyon-styling-25 p.heading-num--02 {
  color: #D17493;
}
.pr-nyon-styling-25 p.heading-num--03 {
  color: #760997;
}
.pr-nyon-styling-25 p.heading-num--04 {
  color: #870A17;
}
.pr-nyon-styling-25 p.heading-num--05 {
  color: #5274AB;
}

.pr-nyon-styling-25 h2.heading {
  margin-bottom: 10px;
}

.pr-nyon-styling-25 p.heading-text {
  font-family: "Noto Serif JP", sans-serif;
  font-size: 20px;
  line-height: 1.5;
  text-align: center;
}

.pr-nyon-styling-25 h3.sub-heading {
  font-weight: 400;
  font-size: 26px;
  line-height: 1.5;
  text-align: center;
  color: #242B33;
  margin-bottom:  40px;
  text-transform: uppercase;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 h3.sub-heading {
    margin-bottom: 30px;
  }
}
/* ----------------------------------------
  アルファベット大文字,頭文字のみ大文字
---------------------------------------- */
/* 大文字 */
.pr-nyon-styling-25 .capitalize {
  text-transform: capitalize;
}
/* 頭文字のみ大文字 */
.pr-nyon-styling-25 .uppercase {
  text-transform: uppercase;
}

/* ----------------------------------------
  ボタン
---------------------------------------- */
.pr-nyon-styling-25 .button-buy {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.pr-nyon-styling-25 .button-buy__link {
  position: relative;
  display: block;
  width: 100%;
  max-width: 140px;
  padding: 3px;
  background-color: #2D2D2D;
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #fff !important;
  text-decoration: none;
  text-align: center;
  border: solid 1px transparent;
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}
/* ボタン（アイテムチェック用）：ホバー時 */
.pr-nyon-styling-25 .product__link:hover .button-buy__link {
  background-color: transparent;
  color: #2D2D2D !important;
  border: solid 1px #2D2D2D;
}

/* ----------------------------------------
  ボタン:商品一覧へ
---------------------------------------- */
.pr-nyon-styling-25 .button-check {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.pr-nyon-styling-25 .button-check__link {
  position: relative;
  display: block;
  width: 100%;
  max-width: 280px;
  padding: 17px 0;
  background-color: #3b0163;
  font-size: 16px;
  font-weight: 400;
  color: #fff !important;
  text-decoration: none;
  text-align: center;
  border: solid 1px transparent;
}
/* ボタン（アイテムチェック用）：ホバー時 */
.pr-nyon-styling-25 .button-check__link:hover {
  background-color: transparent;
  color: #3b0163 !important;
  border: solid 1px #3b0163 ;
}
/* ----------------------------------------
  kv
---------------------------------------- */
.pr-nyon-styling-25 .kv {
  width: 100%;
}

.pr-nyon-styling-25 .kv__img {
  width: 100%;
  height: auto;
}
/* ----------------------------------------
  リード文
---------------------------------------- */
.pr-nyon-styling-25 .lead-text {
  font-family: "Noto Sans JP", sans-serif;
  margin: 40px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  font-size: 0;
}
.pr-nyon-styling-25 .lead-text span {
    font-size: 16px;
    font-weight: 400;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .lead-text {
    display: inline-block;
    margin: 30px 0;
    padding: 0 25px;
    text-align: left;
  }
}

/* ----------------------------------------
  リード文下イメージ写真
---------------------------------------- */
.pr-nyon-styling-25 .lead-image {
  width: 100%;
  max-width: 581px;
  margin: 0 auto 60px;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .lead-image {
    margin: 0 auto 40px;
  }
}

.pr-nyon-styling-25 .lead-image__img {
  width: 100%;
  height: auto;
}

/* ----------------------------------------
  indexリンク
---------------------------------------- */
.pr-nyon-styling-25 .index-link-wrapper {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 7px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 40px;
}

@media (max-width: 767px) {
  .pr-nyon-styling-25 .index-link-wrapper {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: 20px;
  }
}

.pr-nyon-styling-25 .index-link__list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 7px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.pr-nyon-styling-25 .index-link__image {
  margin-bottom: 7px;
}

/* indexリンク-矢印 */
.pr-nyon-styling-25 .index-link__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.pr-nyon-styling-25 .index-link__num {
  margin-bottom: 7px;
  font-size: 18px;
  line-height: 1.1;
  font-weight: 400;
}

.index-link__arrow {
  display: block;
  height: -webkit-fit-content;
  height: -moz-fit-content;
  height: fit-content;
}

.pr-nyon-styling-25 a.index-link__link:hover {
  opacity: 0.7;
}

.pr-nyon-styling-25 .index-link__image {
  width: 100%;
  max-width: 110px;
}

.pr-nyon-styling-25 .index-link__image-img {
  width: 100%;
  height: auto;
}

/* ----------------------------------------
  slickスタイル
  ※!important上書き部分：既存cssの影響あるため
---------------------------------------- */
.pr-nyon-styling-25 .main-slick-container,
.pr-nyon-styling-25 .sub-slick-container {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    padding-bottom: 30px;/* .slick-dots ドットの位置のposition bottom:-30px;分を調整 */
}
.pr-nyon-styling-25 .sub-slick-container {
  margin-bottom: 70px;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .sub-slick-container {
    margin-bottom: 50px;
  }
}

/* メインslick画像サイズ */
.pr-nyon-styling-25 .main-slick-carousel {
    max-width: 481px!important; /* 画像の最大幅と同じに設定 */
    margin: 0 auto !important;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .main-slick-carousel {
    max-width: 351px!important; /* 画像の最大幅と同じに設定 */
  }
}
/* サブslick画像サイズ */
.pr-nyon-styling-25 .sub-slick-carousel {
    max-width: 295px!important; /* 画像の最大幅と同じに設定 */
    margin: 0 auto !important;
}

/* 画像の最大幅 */
.pr-nyon-styling-25 .main-slick-carousel img,
.pr-nyon-styling-25 .sub-slick-carousel img {
    width: 100% !important;
    height: auto !important;      /* 高さは自動で調整され、アスペクト比が維持される */
    display: block !important;    /* 画像の表示をブロック要素にする（インライン要素の余白をなくすため） */
    margin: 0 auto !important;
}

.pr-nyon-styling-25 .text-center {
    text-align: center;
}

/* スリックのドット（インジケータ）をカルーセルの外側に配置する */
/* デフォルトのドットの位置をリセット */
.pr-nyon-styling-25 .slick-dots {
    /* カルーセル本体の下に配置*/
    bottom: -30px !important;
    margin: 0 !important;
    -webkit-transform: translateX(-50%) !important;
            transform: translateX(-50%) !important;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content !important;
}

/* ドットのボーダー */
.pr-nyon-styling-25 .slick-dots li {
    border-color: #BDBDBD !important;
}

/* ドットのスタイル調整  */
.pr-nyon-styling-25 .slick-dots li button {
    font-size: 0 !important; /* ドットのテキストを非表示 */
    line-height: 0 !important;
    display: block !important;
    width: 10px !important;
    height: 10px!important;
    padding: 5px!important;
    cursor: pointer!important;
    color: transparent!important;
    border: 0!important;
    outline: none!important;
    background: transparent !important;/* 非アクティブ時の色 */
    border-radius: 50%!important;
}

.pr-nyon-styling-25 .slick-dots li.slick-active button {
    background: #BDBDBD!important; /* アクティブ時の色 */
}
.pr-nyon-styling-25 .slick-dots .slick-active {
    background-color: #BDBDBD;
}

/* ----------------------------------------
  商品紹介文
---------------------------------------- */
.pr-nyon-styling-25 .product-desc {
  max-width: 440px;
  margin: 20px auto;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .product-desc {
    max-width: 296px;
  }
}

.pr-nyon-styling-25 .product-desc__quotation-bottom {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.pr-nyon-styling-25 .product-desc__text {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 300;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  text-align: center;
  padding: 5px 0;
}

@media (max-width: 767px) {
  .pr-nyon-styling-25 .product-desc__text {
    text-align: left;
  }
}
/* ----------------------------------------
  商品一覧
---------------------------------------- */
.pr-nyon-styling-25 .product {
  max-width: 375px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 167px 167px;
  row-gap: 40px;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
@media (max-width: 767px) {
  .pr-nyon-styling-25 .product {
    max-width: 351px;
    row-gap: 30px;
  }
}
.pr-nyon-styling-25 .product__item {
    max-width: 167px;
}

.pr-nyon-styling-25 .product__link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  gap: 16px;
}

.pr-nyon-styling-25 .product__image {
  max-width: 167px;
  width: 100%;
}

@media (max-width: 767px) {
  .pr-nyon-styling-25 .product__image {
    max-width: initial;
  }
}

.pr-nyon-styling-25 .product__image-img {
  width: 100%;
  height: auto;
}

.pr-nyon-styling-25 .product__item-desc {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  text-align: center;
  line-height: 1.5;
  text-decoration: underline;
  text-decoration-thickness: 1px; /* 下線の太さ */
  text-underline-offset: 2.5px; /* 文字と下線の距離 */
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.pr-nyon-styling-25 .product__link:hover .product__item-desc {
  opacity: 0.7;
}

.pr-nyon-styling-25 .product__item-desc span {
  display: block;
}

