/*　@import url('https://fonts.googleapis.com/css2?family=Jost:wght@300;400;700&family=Noto+Sans+JP:wght@400;700&display=swap');　*/
/* Jost → Poppins に変更（日本語は Noto Sans JP を継続） */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;700&family=Noto+Sans+JP:wght@400;700&display=swap');

/* body
{
/*font-family: "Zen Old Mincho", serif; */
/*font-family: "Lora", serif; */
font-family: "Noto Sans JP", serif; 
font-weight: 400 !important;;
font-style: normal;
} */


body {
  font-family: "Poppins", "Noto Sans JP", sans-serif;
  font-weight: 400 !important;
  font-style: normal;
}

.mark-chips
{
border-radius: 10px;
width: 20px;
height: 20px;
}

.fs-p-logo__image
{
width: 200px !important;
height: auto;
}

.fs-p-headerNavBar
{
/*background-color: #eee;*/
/*background: rgba(126, 126, 126, 0.08);*/
background: rgba(96, 28, 82, 1); /* 85%の不透明度 */
border-bottom: 2px solid #37443c;
color: #fff;
}

.fs-p-headerNavBar a {
  color: #fff !important;  /* リンク文字も白に */
}

.fs-l-footer
{
position: relative;
border-top: 1px solid #37443c;
/*background-color: rgba(126, 126, 126, 0.08);*/
background: rgba(96, 28, 82, 1); /* 85%の不透明度 */
/*background-color: #eee;*/
  /*background-color: #dbe0df;*/
color: #fff;
margin-top: 80px;
}

.fs-p-heading--lv2
{
padding: 0px 0px 0.75em 0px;
margin: 0px 0px 2em 0px;
text-align: center;
}

.fs-c-breadcrumb__list
{
display: flex;
justify-content: center;
/*background:#eee;*/
background: rgba(126, 126, 126, 0.08);
}

.fs-p-phoneOrder__phoneNum
{
font-family: "Marcellus", serif;
font-weight: normal;
}

/*.fs-l-pageMain {
  max-width: 800px;
  width: 100%;
}*/


.fs-p-footerCopyright
{
color: #222;
}

.simple .fs-p-footerUtilityMenu
{
max-width: 1216px;
margin: 49px auto 0px auto;
padding: 0px 8px 0px 16px;
}




ul.igltwrap
{
width: 100%;
}

ul.iglisttext /*ページ上部・商品グループリストテキスト*/
{
max-width: 1200px;
display: flex;
justify-content: space-around;
margin: 0px auto;
padding: 0.75em 0px;
}

ul.iglisttext li
{
list-style-type: none;
padding: 0.5em 2em;
text-align: center;
font-size: 120%;
font-family: "Jost", "Noto Sans JP", sans-serif !important;
font-weight: 700 !important; /* 太字 */
letter-spacing: 0.05em;
text-transform: uppercase;
 white-space: nowrap;
}




ul.iglistimg /*商品グループリスト画像*/
{
display: flex;
justify-content: space-between;
padding: 0px;
flex-wrap: wrap;
}

/*ul.iglistimg::after{
  content:"";
  display: block;
  width:30%;
}*/


ul.iglistimg li
{
list-style-type: none;
padding: 0em;
margin: 0px 0px 3em 0px;
text-align: left;
flex-basis: 30%;
font-size: 140%;
font-family: "Jost", "Noto Sans JP", sans-serif !important;
/*font-family: "Oswald", sans-serif;*/
font-weight: 700 !important; /* 太字 */
letter-spacing: 0.05em;
text-transform: uppercase;
}

ul.iglistimg li a
{
display: block;
}

ul.iglistimg li img
{
margin: 0px 0px 0.25em 0px;
}

ul.iglistimg li .jps
{
display: inline;
font-size: 60%;
font-family: sans-serif;
letter-spacing: 0em;
}

.iglistcol1
{
width: 50%;
float: left;
display: flex;
justify-content: space-around;
flex-wrap: nowrap;
}

.iglistcol2
{
width: 50%;
float: right;
display: flex;
justify-content: space-around;
flex-wrap: nowrap;
}

.iglistcol1 a.fs-pt-column__item,
.iglistcol2 a.fs-pt-column__item
{
text-align: center;
}

.fs-l-header
{
overflow: hidden;
}

.fs-l-footer
{
min-height: 160px;
position: relative;
}

.fs-p-footerCopyright
{
position: absolute;
bottom: 0;
width: 100%;
}

.fs-p-card
{
border: 1px solid #ddd;
margin: 8px 0px 1em 0px !important;
padding: 12px;
}

.fs-c-inputInformation__field
{
margin: 24px 0px;
max-width: 800px;
}

.fs-c-inputInformation__message
{
justify-content: flex-start;
}

.fs-l-header__utility
{
align-self: end;
justify-self: end;
}


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

/*会員ページ系ロゴサイズ指定*/

.fs-l-header__contents
{
grid-template-rows: auto auto;
grid-template-columns: 37.5% 25% 37.5%;
}

.fs-l-header__contents > *
{
padding: 0 0px;
}

.fs-p-logo
{
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 8px 0px 16px 0px;
}

.fs-l-header__utility :first-child
{
padding: 0px 1em 0em 0px;
}
}




/*HOME*/


.fs-body-top .fs-c-productListItem__image
{
/*height: 160px;*/
position: relative;
}

.fs-body-top .fs-c-productListItem__image img
{
object-fit: cover;
object-position: 50% 50%;
width: 100%;
/*height: 160px;*/
}

.fs-pt-carousel img
{
max-width: 100vw;
height: 450px;
}

.fs-body-top .fs-p-heading--lv2
{
padding: 0px 0px 0.75em 0px;
margin: 4em 0px 2em 0px;
text-align: center;
}

#fs_Top .fs-p-memberInfo__points{
    margin: auto auto;
}



/*ページ・フリーページ*/


.cprof
{
display: block;
width: 100%;
margin: 0px auto;
}

.cprof img
{
margin: 2em 0px 3em 0px;
}

.cprof-inner
{
display: block;
width: 80%;
margin: 0px auto;
}

.cprof-inner h2
{
display: block;
margin: 0px 0px 2em 0px;
text-align: center;
}

.cprof-inner p
{
display: block;
margin: 0px 0px 2em 0px;
line-height: 2;
}




/*商品グループ*/


.fs-c-productList__list /*商品グルーフ内商品一覧*/
{
display: grid;
grid-template-columns: calc(25% - 0px) calc(25% - 0px) calc(25% - 0px) calc(25% - 0px);
grid-gap: 0px;
}

.fs-c-productList__list__item
{
margin: 0px 0px 2em 0px;
}



.igimg /*商品グループ画像*/
{
width: 100%;
margin: 0px auto 0em auto;
height: 400px;
position: relative;
}

.igimg img
{
width: 100%;
height: 400px;
object-fit: cover;
object-position: 50% 50%;
}




.fs-body-search ul.iglistimg /*検索ページ・商品グループリスト画像*/
{
display: flex;
justify-content: space-between;
padding: 0px;
flex-wrap: wrap;
}

.fs-body-search ul.iglistimg li
{
list-style-type: none;
padding: 0em;
margin: 0px 0px 3em 0px;
text-align: left;
flex-basis: 16%;
font-size: 140%;
font-family: "Jost", "Noto Sans JP", sans-serif !important;
/*font-family: "Oswald", sans-serif;*/
font-weight: 700 !important; /* 太字 */
letter-spacing: 0.05em;
text-transform: uppercase;
font-weight: 200;
}

.fs-body-search ul.iglistimg li a
{
display: block;
}

.fs-body-search ul.iglistimg li img
{
margin: 0px 0px 0.25em 0px;
}

.fs-body-search ul.iglistimg li .jps
{
display: inline;
font-size: 60%;
font-family: sans-serif;
letter-spacing: 0em;
}





.fs-c-productListItem__image
{
/*height: 240px;*/
position: relative;
}

.fs-c-productListItem__image img
{
object-fit: cover;
object-position: 50% 50%;
width: 100%;/*height: 240px;*/
}



.fs-c-productListItem__control
{
justify-content: flex-start;
}

.fs-c-productListItem__control > :last-child
{
margin-left: 0;
}

.igdesc
{
text-align: center;
margin: 0px 0px 4em 0px;
}


.fs-c-heading--page
{
font-family: "Jost", "Noto Sans JP", sans-serif !important;
/*font-family: "Oswald", sans-serif;*/
font-weight: 700 !important; /* 太字 */
font-size: 2.4rem;
text-transform:uppercase;
font-weight: 200;
letter-spacing: 0.1em;
padding:1.8em 0px;
}


/*商品詳細*/


.fs-l-product3 .fs-l-productLayout
{
display: grid;
grid-template-columns: 1fr 1fr;
/*grid-gap: 5%;*/
grid-gap: 2.5%;
align-items: start;
}

.fs-l-product2 .fs-l-productLayout
{
display: grid;
/*grid-template-columns: calc(60% - 16px / 2) calc(40% - 16px / 2);*/
grid-template-columns: calc(47.5%) calc(47.5%);
grid-gap: 5%;
/*grid-gap: 16px;*/
align-items: start;
}

.fs-c-productThumbnail .fs-c-productThumbnail__image{
 flex-basis: 100px;
}



/*商品イメージギャラリー・カルーセル系*/

.fs-c-productCarouselMainImage__thumbnailList
{
height: 200px;
overflow-y: visible;
}

.fs-c-productCarouselMainImage__thumbnail
{
height: 80px;
position: relative;
}

.fs-c-productCarouselMainImage__thumbnail img
{
object-fit: cover;
object-position: 50% 50%;
height: 80px;
width: 100%;
}


.fs-c-productMainImage__image img
{
max-height: 600px;
width: auto;
}

#fs_productCarouselMainImage
{
width: 1200px;
margin: auto;
}

#fs_productCarouselMainImage img
{
width: 1200px;
height: auto;
max-height: none;
}




.fs-p-productDescription
{
margin: 0px 0px 3em 0px !important;
}

.fs-p-card:last-of-type
{
margin: 8px 0px 3em 0px !important;
}

.fs-c-button--addToCart--detail
{
font-size: 130%;
}

.fs-c-productThumbnail__image__caption
{
display: none;
}




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

ul.iglisttext li
{
flex-basis: 50%;
}
}

/* =========================================
   PC表示のみ 全体を85%縮小（mano a mani）
   ========================================= */
@media screen and (min-width: 769px) {
    html {
        zoom: 0.90; /* Chrome / Edge / Safari */
    }
    /* Firefox対策 */
    body {
        -moz-transform: scale(0.90);
        -moz-transform-origin: top center;
    }
}

/* =================================
   カラーバリエーション：色玉 最終確定版
   方針：
   ・色玉＝脚の色
   ・hover＝浮く＋影＋明るく＋文字太字
   ・選択確定＝チェックマーク（色は変えない）
   ================================= */

/* ---------- レイアウト ---------- */
.fs-c-variationPanelList__list {
  gap: 12px;
}

/* ---------- 色玉共通 ---------- */
.fs-c-variationPanelList__panel {
  width: 76px;
  height: 76px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;

  /* FS標準の薄くなる処理を無効化 */
  opacity: 1 !important;
  filter: none !important;

  position: relative; /* チェック表示用 */
}

/* 中身 */
.fs-c-variationPanelList__panel__content {
  padding: 0;
  background: transparent !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 画像は使わない */
.fs-c-variationPanelList__panel__image {
  display: none !important;
}

/* 文字 */
.fs-c-variationPanelList__panel__label {
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
  padding: 0 6px;
  color: #fff;
}

/* ---------- 色割り当て（脚の色＝色玉） ---------- */

/* Antique Steel */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Antique Steel"]
+ .fs-c-variationPanelList__panel {
  background: #3a312c;
}

/* Tomette Red */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Tomette Red"]
+ .fs-c-variationPanelList__panel {
  background: #a5321a;
}

/* Sunflower Yellow */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Sunflower Yellow"]
+ .fs-c-variationPanelList__panel {
  background: #f2b100;
}

/* Mineral Blue */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Mineral Blue"]
+ .fs-c-variationPanelList__panel {
  background: #2f3451;
}

/* Rosemary Green */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Rosemary Green"]
+ .fs-c-variationPanelList__panel {
  background: #4c5237;
}

/* Eucalyptus Grey */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Eucalyptus Grey"]
+ .fs-c-variationPanelList__panel {
  background: #7f836d;
}

/* Ash Pink */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Ash Pink"]
+ .fs-c-variationPanelList__panel {
  background: #cc9a82;
}

/* Graphite Black */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Graphite Black"]
+ .fs-c-variationPanelList__panel {
  background: #2f2f2f;
}

/* Cloud White */
.fs-c-variationPanelList__radio[data-vertical-variation-name="Cloud White"]
+ .fs-c-variationPanelList__panel {
  background: #f6f6f6;
}
.fs-c-variationPanelList__radio[data-vertical-variation-name="Cloud White"]
+ .fs-c-variationPanelList__panel
.fs-c-variationPanelList__panel__label {
  color: #222;
}

/* ---------- hover演出（PCのみ） ---------- */
@media (hover: hover) and (pointer: fine) {

  .fs-c-variationPanelList__panel {
    transition: transform .15s ease,
                box-shadow .15s ease,
                filter .15s ease;
  }

  .fs-c-variationPanelList__panel:hover {
    transform: translateY(-4px) scale(1.04);
    box-shadow:
      0 10px 24px rgba(0,0,0,.22),
      0 4px 8px rgba(0,0,0,.14);
    filter: brightness(1.08);
  }

  .fs-c-variationPanelList__panel:hover
  .fs-c-variationPanelList__panel__label {
    font-weight: 700;
  }
}

/* ---------- 選択確定：チェックマーク ---------- */
.fs-c-variationPanelList__radio:checked
+ .fs-c-variationPanelList__panel::after {
  content: "✓";
  position: absolute;
  top: 6px;
  right: 8px;

  width: 22px;
  height: 22px;
  border-radius: 50%;

  background: #fff;
  color: #333;
  font-size: 14px;
  font-weight: 700;

  display: flex;
  align-items: center;
  justify-content: center;

  box-shadow: 0 2px 6px rgba(0,0,0,.25);
}

/* カート追加メッセージをトースト風に */
.fs-c-message,
.fs-c-notice {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 9999;

  background: #ffffff;
  color: #333;
  padding: 14px 18px;
  border-radius: 10px;

  box-shadow:
    0 12px 28px rgba(0,0,0,.18),
    0 4px 10px rgba(0,0,0,.12);

  font-size: 14px;
  font-weight: 600;
}

@media (hover: hover) and (pointer: fine) {
  /* hover中の色玉を強調 */
  .fs-c-variationPanelList__panel:hover{
    transform: translateY(-4px) scale(1.06);
    box-shadow: 0 14px 32px rgba(0,0,0,.28), 0 6px 12px rgba(0,0,0,.18);
    filter: brightness(1.10);
  }

  /* hoverしている色玉以外を少し薄く */
  .fs-c-variationPanelList__list:hover .fs-c-variationPanelList__panel{
    opacity: .55;
    transition: opacity .15s ease;
  }
  .fs-c-variationPanelList__list:hover .fs-c-variationPanelList__panel:hover{
    opacity: 1;
  }
}

/* 画像が変わった感：フェード */
.fs-c-productMainImage__image img,
.fs-c-productCarouselMainImage__image img,
.fs-c-productCarouselMainImage__thumbnail img {
  transition: opacity .18s ease, transform .18s ease;
}

/* クリックした直後に“変化”が伝わるように少しだけズーム */
.fs-c-productMainImage__image img,
.fs-c-productCarouselMainImage__image img {
  transform: translateZ(0);
}

/* =================================
   施工例サムネ：1個ずつhoverで浮く（バグらない版）
   ================================= */

/* サムネ画像の基本（常時） */
.fs-c-productCarouselMainImage__thumbnail img,
.fs-c-productThumbnail__image img,
.fs-c-productMainImage__thumbnailList img {
  display: block;
  border-radius: 10px;
  transition:
    transform .15s ease,
    box-shadow .15s ease,
    filter .15s ease,
    border-radius .15s ease;
  will-change: transform, box-shadow, filter, border-radius;
}

/* 親側にも角丸が必要な場合だけ（はみ出し対策） */
.fs-c-productCarouselMainImage__thumbnail,
.fs-c-productThumbnail__image,
.fs-c-productMainImage__thumbnailList {
  border-radius: 10px;
  overflow: hidden;
}

/* hover演出（PCのみ） */
@media (hover: hover) and (pointer: fine) {

  /* ✅ “hoverした画像だけ”浮かせる */
  .fs-c-productCarouselMainImage__thumbnail img:hover,
  .fs-c-productThumbnail__image img:hover,
  .fs-c-productMainImage__thumbnailList img:hover {
    transform: translateY(-4px) scale(1.03);
    border-radius: 14px;
    box-shadow:
      0 12px 26px rgba(0,0,0,.22),
      0 4px 10px rgba(0,0,0,.14);
    filter: brightness(1.06);
  }

  /* クリックできる感 */
  .fs-c-productCarouselMainImage__thumbnail img,
  .fs-c-productThumbnail__image img,
  .fs-c-productMainImage__thumbnailList img {
    cursor: pointer;
  }
}