/*____________________________________________________________________________

SITE TITLE: FASCINATE
TITLE: SP ブログ・ニュースCMS 下層テンプレート

(1) 全体
(2) 見出し
(3) リスト
(4) 商品ウィジェット
(5) LINE一覧
(5) 店舗情報
(6) 回遊ナビ

UPDATED:2024.05

____________________________________________________________________________*/

/*----------------------------------------------------------------------------
  全体
----------------------------------------------------------------------------*/
.w1024,
.w750 {
  width: 100%;
  margin: auto;
}

#cms-contentsPage {
  width: 100%;
  padding: 0 15px;
  font-size: 14px;
  line-height: 2em;
  letter-spacing: 0.02em;
  color: var(--text);
  margin: 30px 0;
}

#main-content {
  margin-top: 30px;
}

/* テキストリンク */
#heading a,
#main-content a {
  text-decoration: underline 1px solid #555;
  text-underline-offset: 5px;
}

#fas-blog-index a {
  text-decoration: none;
}

#main-content p {
  color: var(--text);
  font-size: 14px;
  line-height: 2em;
  letter-spacing: 0.02em;
  margin: 0 0 1em 0;
}

#main-content section {
  margin: 30px 0;
}

#cms-contentsPage img {
  width: 100%;
  margin-bottom: 15px;
}

#main-content .btn {
  width: 100%;
  height: 50px;
  line-height: 50px;
  display: block;
  text-decoration: none !important;
  border-radius: 2px;
  background: #9b7000;
  color: #fff !important;
  text-align: center;
  font-weight: bold;
  font-size: 13px;
}

/* /cont/ページ 表示崩れ用 */
#cms-contents {
  padding: 0 !important;
  margin: 0 !important;
}

/*----------------------------------------------------------------------------
  見出し
----------------------------------------------------------------------------*/
#heading h1.heading-title {
  font-size: 22px;
  line-height: 1.5em;
  margin: 0 0 10px 0;
  font-weight: normal;
  padding: 0;
}

#heading .heading-date {
  display: block;
  font-size: 12px;
  color: var(--text-pale);
  margin-bottom: 20px;
  line-height: 1em;
  padding-bottom: 20px;
  border-bottom: 1px solid #ddd;
}

#heading .heading-subTitle {
  margin: 10px 0 0;
  display: block;
}

#cms-contentsPage h2 {
  font-size: 22px;
  line-height: 1.6em;
  font-weight: normal;
  text-align: left;
  margin-bottom: 20px;
  padding: 0 0 10px 0;
  border-bottom: 1px solid #eee;
}

#cms-contentsPage h3 {
  font-size: 18px;
  font-weight: 600;
  padding: 0;
  margin: 30px 0 15px;
}

#cms-contentsPage h4 {
  font-size: 16px;
  font-weight: 400;
  padding: 15px;
  margin: 30px 0;
  background: #f5f5f5;
  border-radius: 4px;
}

#cms-contentsPage h5 {
  font-size: 16px;
  font-weight: 400;
}

#cms-contentsPage h6 {
  font-size: 14px;
  margin: 0;
}

#cms-contentsPage hr {
  margin: 30px 0;
  background: #ddd;
  height: 1px;
  padding: 0;
  border: 0;
}

/*----------------------------------------------------------------------------
  リスト
----------------------------------------------------------------------------*/
.info-table {
  margin-bottom: 30px;
}

.info-table a {
  text-decoration: underline;
}

.info-table dl {
  border-bottom: #ddd solid 1px;
}

.info-table dl:first-child {
  border-top: #ddd solid 1px;
}

.info-table dl dt {
  display: table-cell;
  vertical-align: middle;
  width: 145px;
  font-weight: 600;
  padding: 20px 10px;
}

.info-table dl dd {
  display: table-cell;
  vertical-align: middle;
  padding: 20px 10px;
}


/*----------------------------------------------------------------------------
  商品ウィジェット
----------------------------------------------------------------------------*/
.catalog-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.catalog-list ul li {
  list-style-type: none;
}

.catalog-list li {
  list-style-type: none;
  width: calc((100% - 10px)/2);
  margin: 0;
}

.catalog-img {
  width: 100%;
  margin-bottom: 0px !important;
  aspect-ratio: 2 / 3;
  object-fit: cover;
}

.catalog-content {
  padding: 12px 5px 20px 5px;
  line-height: 1.4;
  text-align: center;
  margin-top: 0px;
}

.catalog-brandName {
  font-size: 12px;
  font-weight: 700;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  color: var(--black);
  margin-bottom: 9px;
}

.catalog-commodityName {
  font-size: 11px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  color: var(--text-dark);
  margin-bottom: 7px;
}

.catalog-price {
  font-size: 11px;
  font-weight: 700;
  color: var(--text-dark);
}

.catalog-price.-discount {
  color: #ff0030;
}

/* 背景グレー */
.catalog-imgContainer {
  position: relative;
}

.catalog-imgContainer:before {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: rgba(0, 0, 0, 0.02);
  content: '';
}

/* 販売開始前 */
.catalog-beforeSale.saleStartDatetime {
  font-size: 12px;
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  -webkit-text-overflow: ellipsis;
  color: #333;
  margin-top: 10px;
}

/* 在庫なし */
.catalog-outOfStock .catalog-imgContainer::after {
  position: absolute;
  display: block;
  inset: 0;
  margin: auto;
  content: "Out of Stock";
  text-align: center;
  font-size: 18px;
  height: 18px;
  line-height: 18px;
  color: var(--text-light);
}

.catalog-outOfStock .catalog-imgContainer .catalog-img {
  opacity: .5;
}

/* 共通テンプレート catalogList_template (新Handlebarsテンプレート用) */
#main-content .catalog-contents .catalogList {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 20px 10px;
}

#main-content .catalog-contents .catalogList a {
  text-decoration: none;
}

#main-content .catalog-contents .catalogList > li {
  width: calc((100% - 10px) / 2);
  list-style: none;
  margin: 0;
}

#main-content .catalog-contents .catalogList .catalog-campaignGroup,
#main-content .catalog-contents .catalogList .catalog-campaignGroup > li {
  margin: 0;
}

#main-content .catalog-contents .catalogList .product-text :is(p, span) {
  line-height: 1.3;
  margin-bottom: .6em;
}

#main-content .catalog-contents .catalogList .brandName {
  font-size: 13px;
  margin-bottom: .5em !important;
}

#main-content .catalog-contents .catalogList .commodityName {
  color: var(--text-light);
  font-size: 11px;
}

#main-content .catalog-contents .catalogList .priceLine p {
  font-size: 12px;
}

#main-content .catalog-contents .catalogList .-sale {
  color: var(--sale);
}

/* 新テンプレート用 在庫切れ表示 */
#main-content .catalog-contents .catalogList_item.-outOfStock .product-image::after {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  content: "Out of Stock";
  font-size: 16px;
  color: var(--text-dark);
}

#main-content .catalog-contents .catalogList_item.-outOfStock .product-image img {
  opacity: .5;
}

/*----------------------------------------------------------------------------
  LINE一覧
----------------------------------------------------------------------------*/
.line-list {
  display: flex;
  gap: 10px;
  text-align: center;
  background: #f5f5f5;
  padding: 15px;
  flex-wrap: wrap;
  justify-content: space-between;
}

.line-item {
  max-width: 48%;
  margin: 0;
}

#main-content .line-item a {
  text-decoration: none;
}

/*----------------------------------------------------------------------------
  店舗情報
----------------------------------------------------------------------------*/
/*Google Map*/
#main-content .inquiry-contents .google-maps iframe {
  width: 100%;
  aspect-ratio: 1/1;
}

#main-content .inquiry-contents hr {
  display: block;
}

/*----------------------------------------------------------------------------
  回遊ナビ
----------------------------------------------------------------------------*/
.cms-list {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  column-gap: 10px;
}

.cms-list .cms-title {
  margin: 0;
  font-size: 12px;
  line-height: 1.3rem;
}

.cms-list li {
  width: calc((100% - 10px) /2);
  box-sizing: border-box;
  margin: 0 !important;
  list-style-type: none !important;
}

.cms-list li a {
  display: block;
}

.cms-list .cms-img img {
  width: 100%;
  height: 100%;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  text-align: center;
  object-fit: cover;
  margin-bottom: 0 !important;
  padding: 0 !important;
}

.cms-list .cms-txt {
  padding: 8px 5px;
  line-height: 1.5em;
}

.cms-txt .cms-title,
.cms-txt .cms-subtitle {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: break-word;
}

.cms-txt .cms-title {
  color: var(--text-dark);
  font-size: 13px;
  font-weight: bold;
  margin-bottom: 4px !important;
}

.cms-txt .cms-subtitle,
.cms-txt .cms-date {
  color: var(--text-light);
  font-size: 11px;
  margin-bottom: 2px !important;
}

.cms-newbrandContainer .cms-date{
  display:none;
}