@charset "utf-8";

/*---------------------------------------- kv */
.bp-kv__headline {
  z-index: 2;
}
.bp-kv__image-slider {
  position: relative;
  width: 100%;
  padding-bottom: 40%;
  overflow: hidden;
}
.bp-kv__image-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity .6s ease-in-out;
  z-index: 0;
}
.bp-kv__image-wrap.is-active {
  opacity: 1;
  z-index: 1;
}
.text-link-arrow {
  border-top: 1px solid var(--text-main-color);
  border-right: 1px solid var(--text-main-color);
  content: '';
  height: 6px;
  right: 12px;
  pointer-events: none;
  transform: translate(-3px, -3px) rotate(135deg);
  width: 6px;
  display: inline-block;
  margin-left: 10px;
}
.campaignlink-top-kv__headline--linkwrap .bp-kv__headline {
  left: auto;
  margin: 0 auto;
  max-width: auto;
  padding: 0;
  top: auto;
  transform: none;
  width: 100%;
  position: relative;
}
.campaignlink-top-text-link:nth-of-type(1) {
  margin-top: 25px;
}
.campaignlink-top-text-link {
  margin-top: 10px;
}
@media (max-width: 767px) {
  .bp-kv__headline-sub {
    font-size: 15px;
  }
  .bp-kv__image-slider {
    padding-bottom: 60%;
  }
  .campaignlink-top-kv__headline--linkwrap {
    padding: 25px var(--sp-padding-horizontal) 30px;
  }
  .campaignlink-top-kv__headline--linkwrap .bp-box-link-wrap {
    margin: 50px 0 0;
  }
  .campaignlink-top-kv__headline--linkwrap .bp-box-link-wrap__inner {
    padding: 0;
  }
}
@media screen and (min-width: 768px) {
  .bp-kv__headline-sub {
    font-size: 20px;
  }
  .campaignlink-top-kv__headline--linkwrap {
    left: 25%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 450px;
    z-index: 2;
    position: absolute;
  }
  .campaignlink-top-kv__headline--linkwrap .bp-box-link-wrap {
    margin: 30px 0 0;
  }
  .campaignlink-top-kv__headline--linkwrap .bp-box-link-wrap .bp-box-link-wrap__inner {
    justify-content: left;
    margin: 0;
    max-width: auto;
    padding: 0;
  }
  .campaignlink-top-kv__headline--linkwrap .bp-box-link-wrap__inner .bp-box-link-item {
    margin: 0;
  }
  .bp-kv__image-wrap.d-n-pc {
    display: none;
  }
}

/*---------------------------------------- intro */
.campaign-showroom-intro-title {
  display: block;
  color: var(--text-main-color);
  font-size: 20px;
  letter-spacing: var(--default-letter-spacing-ja);
  line-height: 1.8;
  margin-bottom: 15px;
  text-align: center;
}
.campaign-showroom-intro-text {
  color: var(--text-main-color);
  font-size: 13px;
  letter-spacing: var(--default-letter-spacing-ja);
  line-height: 2.0;
  margin: 0;
  text-align: center;
}
@media screen and (max-width: 767px) {
  .campaign-showroom-intro {
    margin: 45px auto;
  }
  .campaign-showroom-intro-title {
    text-align: left;
  }
  .campaign-showroom-intro-text {
    text-align: left;
  }
}
@media screen and (min-width: 768px) {
  .campaign-showroom-intro {
    margin: 60px auto 100px;
  }
}

/* 人気アイテム一覧エリア */
@media screen and (max-width: 767px) {
  .bp-section.products-area-headline-wrap {
    margin: 20px 0;
  }
  .marriagering-area-buttons-wrap {
    margin: 60px 0 0;
  }
  .marriagering-area-buttons-wrap .bp-box-link-wrap {
    margin: 50px auto;
  }
  .reservation-button-wrap .bp-box-link-wrap {
    margin-bottom: 60px;
  }
  #about-area .bp-panel-slider {
    margin-top: 60px;
  }
}
@media screen and (min-width: 768px) {
  .bp-section.products-area-headline-wrap {
    margin: 20px 0 40px;
  }
  .marriagering-area-buttons-wrap .bp-box-link-wrap {
    margin: max(5vw, 60px) auto;
  }
  .reservation-button-wrap {
    margin-top: calc(var(--pc-padding-vertical) + 10px);
  }
  .bp-headline--pc-center {
    text-align: center;
  }
}
.products-area-headline-wrap h2 {
  margin: 0 0 10px;
}
#marriagering-area + .bp-section {
  margin: 30px auto;
}
#engagementring-and-necklace-area + .bp-section {
  margin-bottom: 30px;
}
.bp-panel-marriagering-products-section,
.bp-panel-engagementring-and-necklace-products-section {
  margin: 50px 0 20px;
}
.bp-panel-marriagering-products-section .bp-panel-layered-product-slider-list {
  margin-bottom: 80px !important;
}

/* @note: クラス名変更予定 */
.category-index-slider-list-wrap {
  display: flex;
  justify-content: space-between;
}
.category-index-slider-list-image-wrap {
  position: relative;
  padding: 31.5% 15%;
}
.category-index-slider-list-image-wrap::before {
  background-color: var(--base-color);
  content: '';
  height: 100%;
  left: 0;
  opacity: .1;
  pointer-events: none;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 1;
}
.category-index-slider-list-name {
  font-size: 13px;
  margin: 10px 0 2px;
  width: 100%;
}
.category-index-slider-list-item__link-area {
  color: var(--text-main-color);
}
.category-index-slider-list-item__link-area:hover, .category-index-slider-list-item__link-area:focus {
  color: var(--text-main-color);
}
.category-index-slider-list-price {
  color: var(--text-sub-color);
  font-size: 9px;
  margin: 0;
  width: 100%;
}
.category-index .bp-panel-product-slider-headline .lower-section__headline-ja {
  font-size: 18px;
}
@media screen and (min-width: 768px) {
  .category-index-feature-headline-sub-text-area {
    max-width: 700px;
    padding: 10px 40px;
  }
  .category-index-slider-list-wrap:nth-of-type(2) {
    margin: 50px auto;
  }
  .category-index-slider-list {
    width: 18.5%;
  }
}
@media screen and (max-width: 767px) {
  .category-index-feature-headline-sub-text-area {
    width: 100%;
    padding: 5px 10px;
    margin-right: 5%;
  }
  .category-index-how-to-select .bp-section__inner,
  .category-index-feature .bp-section__inner {
    padding-right: 0px;
  }
  .category-index-slider-list-wrap {
    margin: calc(4vw + 22px) 0 0 auto;
    overflow-x: scroll;
    padding: 0 5.335% 0 0;
    width: 100%;
  }
  .category-index-slider-list-wrap:last-child {
    margin: calc(4vw + 8px) 0 0 auto;
  }
  .category-index-slider-list {
    margin: 0 2.6675% 16px;
    min-width: 180px;
    width: 100%;
  }
  .category-index-slider-list:first-child {
    margin: 0 2.6675% 16px 0;
  }
  .category-index-slider-list:last-child {
    margin: 0 0 16px 2.6675%;
  }
}



/* 地図表示 */
.campaign-showroom-detail-text--column-title {
  font-size: 13px;
  margin-bottom: 6px;
}
.campaign-showroom-map-iframe {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .campaign-showroom__detail-wrap {
    display: flex;
    justify-content: space-between;
  }
  .campaign-showroom-map-iframe {
    aspect-ratio: 1 / 1;
  }
  .campaign-showroom-map {
    width: 53%;
  }
  .campaign-showroom-detail-text {
    width: 43%;
  }
}
@media screen and (max-width: 767px) {
  .campaign-showroom-map-iframe {
    aspect-ratio: 3 / 2;
  }
  .campaign-showroom-map,
  .campaign-showroom-detail-text {
    width: 100%;
  }
}


@media screen and (min-width: 768px) {
  .campaign-showroom__text-link {
    color:#21201F;
  }

  .campaign-showroom__h3,
  .campaign-showroom__p {
    letter-spacing:0.1em;
  }

  /*________________________________________________________ container _____*/
  .campaign-showroom__container {
    width: 100%;
    margin:0 auto;
    font-size: 15px;
    letter-spacing: 0.1em;
    color:#21201F;
  }

/*________________________________________________________ section _____*/

  .campaign-showroom-section {
    width: 1140px;
    margin: 0 auto 100px;
  }

  .campaign-showroom-access {
    margin-bottom: 100px;
  }

  /* ショールーム一覧　*/
  .campaign-showroom__h3-list {
    border:none;
    text-align:center;
    margin: 0 auto 20px auto;
  }
  
  /* ショールームアクセス */
  .campaign-showroom__showroom {
    margin:230px auto 0 auto;
  }

  /* ---小見出し  ---*/
  .campaign-showroom__subheading {
    color: var(--text-main-color);
    text-align: center;
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
  }

/* モーダルウィンドウ */
  .modal-dialog {
  	max-width: 600px;
  }
  .campaign-showroom__modal-dialog {
    font-size: 14px;
    letter-spacing: 0.07em;
    color: rgba(0, 0, 0, 0.8);
  }

  /* 金沢ショールームマップ */
  .showroom-detail-map--kanazawa {
  	position: relative;
  	z-index: 0;
  	overflow: hidden;
  }
  .showroom-detail-map--kanazawa > iframe {
  	left: 0;
  	position: absolute;
  	top: -60px;
  	width: 100%;
  	padding: 0 7px;
  }
  
/* --- 予約フォーム --- */
  .campaign-showroom__contact {
    margin-top:3%;
  }
}


@media screen and (max-width: 767px) {
  .campaign-showroom__clearfix:after {
    content: ".";  /* 新しいコンテンツ */
    display: block;
    clear: both;
    height: 0;
    visibility: hidden; /* 非表示に */
  }


/*________________________________________________________ container _____*/

  .campaign-showroom__container {
    width: 100%;
    margin:0 auto;
    color:#21201F;
  }

/*________________________________________________________ section _____*/

  .campaign-showroom-section {
    width: 100%;
    margin: 0;
  }

  /* 見出し */
  .campaign-showroom__heading-area {
    padding-bottom:20px;
  }
  .campaign-showroom__heading-area-h3 {
    color:#21201F;
    font-size:1.3em;
    padding:15px 0;
    margin:0;
    border-bottom:2px solid #21201F;
  }
  .campaign-showroom__heading-area-p {
    margin-top:1rem;
    text-align:justify;
  }


  /* ショールーム一覧　*/
  .campaign-showroom__list {
    padding:3%;
  }
  
  .campaign-showroom__h3-list {
    border:none;
    text-align:center;
    margin: 0 auto ;
  }
  
  /* ショールームアクセス */
  .campaign-showroom__showroom {
    margin:50px 0;
  }

  /* ---小見出し  ---*/
  .campaign-showroom__subheading {
    color:#21201F;
    text-align: center;
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid #ccc;
  }

  /* モーダルウィンドウ */
  .campaign-showroom__modal-dialog {
    line-height: 1.7;
    letter-spacing: 0.07em;
  }

  .campaign-showroom__modal-dialog a:visited,
  .campaign-showroom__modal-dialog a:link {
    letter-spacing: 0.078em;
  }

  /* 金沢ショールームマップ */
  .showroom-detail-map--kanazawa {
  	position: relative;
  	z-index: 0;
  	overflow: hidden;
  	height: 400px;
  }
  .showroom-detail-map--kanazawa > iframe {
  	height: calc(100% + 60px);
  	left: 0;
  	position: absolute;
  	top: -60px;
  	width: 100%;
  	padding: 0 7px;
  }

  /* --- 予約フォーム --- */
  .campaign-showroom__contact {
    padding-top:6%;
  }

  #visit_date_time_on1.form-control {
    font-feature-settings: "palt";
    font-size: 15px;
  }
}

ul.campaign-showroom__train-info {
  list-style: disc;
  padding-left: 20px;
}
ul.campaign-showroom__train-info ul.campaign-showroom__train-info {
  list-style: circle;
}
