@charset "UTF-8";
/* ====================================================================
   eclat 全体共通 CSS
   - 旧 PC base.css と SP base.css の共通項を統合
   - 全セレクタは .eclat-wrap 配下にスコープ
   - PC: 旧 viewport=1300 で 1300px 想定
   - SP: 旧 viewport=640 で 640px 想定
   - メディアクエリ境界: max-width: 768px
==================================================================== */
.product-detail .p-product-detail__btn_onlineshop {
	margin-top: 20px;
	font-size: 14px;
}
.product-detail .p-product-detail__btn_onlineshop a {
	margin-top: 0;
	border-color: #3c4043 !important;
	color: #3c4043 !important;
}
.product-detail .p-product-detail__btn_onlineshop a:before {
	display: none;
}


/* ────────────────────────────────────────────────
   1. ラッパー本体（ボックスサイジング、フォント、色）
──────────────────────────────────────────────── */
.eclat-wrap {
  color: #000;
  line-height: 1.8;
  letter-spacing: 1px;
  /* font-family: "メイリオ", "Helvetica Neue", Helvetica, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; */
	font-family: "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "游明朝", YuMincho, "Hiragino Mincho W3 JIS2004", "MotoyaLCedar", "DroidSansJapanese", serif;
  font-size: 14px;
	background-color: #fbfbfb;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
	text-size-adjust: 100%;
	font-feature-settings: "palt";
	padding: 50px 25px;
	overflow: clip;
}
/* SP
----------------------------------*/
@media screen and (max-width: 768px) {
	.eclat-wrap {
		padding: 40px 15px;
	}
}

.eclat-wrap,
.eclat-wrap *,
.eclat-wrap *::before,
.eclat-wrap *::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

/* ────────────────────────────────────────────────
   2. リセット（ラッパー配下のみ）
──────────────────────────────────────────────── */
.eclat-wrap h1,
.eclat-wrap h2,
.eclat-wrap h3,
.eclat-wrap h4,
.eclat-wrap h5,
.eclat-wrap h6,
.eclat-wrap p,
.eclat-wrap dl,
.eclat-wrap dt,
.eclat-wrap dd { margin: 0; padding: 0; font-size: 100%; font-weight: normal; }

.eclat-wrap ul,
.eclat-wrap ol { margin: 0; padding: 0; list-style: none; vertical-align: baseline; background: transparent; }

.eclat-wrap img {
  border: none;
  line-height: 0;
  font-size: 0;
  vertical-align: bottom;
  max-width: 100%;
}

.eclat-wrap a {
  margin: 0;
  padding: 0;
  font-size: inherit;
  background: transparent;
  color: #000;
  text-decoration: none;
  overflow: hidden;
  outline: none;
}
.eclat-wrap a:visited { color: #000; text-decoration: underline; }
.eclat-wrap a:hover   { color: #D71853; text-decoration: underline; }
.eclat-wrap a:active  { color: #D71853; text-decoration: none; }
.eclat-wrap a:hover img {
  filter: alpha(opacity=60);
  -moz-opacity: 0.6;
  opacity: 0.6;
}

/* ────────────────────────────────────────────────
   3. ユーティリティ
──────────────────────────────────────────────── */
.eclat-wrap .clrfix::before,
.eclat-wrap .clrfix::after { content: ""; display: table; }
.eclat-wrap .clrfix::after { clear: both; }

.eclat-wrap .u-pcOnly { display: block; }
.eclat-wrap .u-spOnly { display: none; }
.eclat-wrap span.u-pcOnly,
.eclat-wrap span.u-spOnly { display: inline; }
.eclat-wrap span.u-spOnly { display: none; }

@media (max-width: 768px) {
  .eclat-wrap .u-pcOnly { display: none; }
  .eclat-wrap .u-spOnly { display: block; }
  .eclat-wrap span.u-pcOnly { display: none; }
  .eclat-wrap span.u-spOnly { display: inline; }
}

/* ────────────────────────────────────────────────
   4. モーダル共通（graylayer は body 直下に挿入される）
──────────────────────────────────────────────── */
.graylayer {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: #000;
  filter: alpha(opacity=40);
  -moz-opacity: 0.4;
  opacity: 0.4;
  z-index: 99998;
}
@media (max-width: 768px) {
  .graylayer {
    filter: alpha(opacity=10);
    -moz-opacity: 0.1;
    opacity: 0.1;
  }
}