/* ============================================================
   製品詳細ページ 共通スタイル
   対象: .pd-page クラス付きページ（8製品ページ共通）
============================================================ */

/* -----------------------------------------------
   リセット・ベース
----------------------------------------------- */
.pd-page figure { margin: 0; }
.pd-page img { display: block; width: 100%; height: auto; }
.pd-page ul, .pd-page ol { list-style: none; margin: 0; padding: 0; }

.u-mt60 {
	margin-top: 60px !important;
}

.u-mt100 {
	margin-top: 100px !important;

}
.u-mt120 {
	margin-top: 120px !important;
}

.u-mt130 {
	margin-top: 130px !important;
}

.u-mt80 {
	margin-top: 80px !important;
}

.u-mb0 {
	margin-bottom: 0 !important;
}

.u-w620 {
	max-width: 620px;
}

figcaption {
	font-size: 18px;
	font-weight: 500;
	color: #282828;
	margin-top: 15px;
}

/* -----------------------------------------------
   イントロセクション
----------------------------------------------- */

.un_bm_product_intro_label.u-center {
	text-align: center;
	margin: 0 auto 20px;
	display: block;
}

.un_fs_modal_close {
	top: 0;
	right: 0;
}

.chemicals-linkArea {
width: 100%;
max-width: 100%;
margin-top: 40px;
}

.chemicals-itemLinkArrow {
	width: 17%;
	height: auto;
	max-width: 75px;
	aspect-ratio: 1/1;
}


.pd-intro {
  margin-top: 76px;
  margin-bottom: 100px;
  background: #fff;
}
.pd-intro__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
  display: flex;
  gap: 70px;
  align-items: flex-start;
  margin-bottom: 57px;
}

/* 左カラム：画像 */
.pd-intro__img-col { flex: 0 0 55%; }
.pd-intro__main-img { width: 100%;
	aspect-ratio: 753/497;
	margin-bottom: 38px !important;

}
.pd-intro__main-img img {
	width: 100%;
	object-fit: cover;
}
.pd-intro__sub-list {
  display: flex;
  gap: 27px;

}
.pd-intro__sub-item { 	max-width: 160px;
	aspect-ratio: 160/105;
	width: 100%;
 }
.pd-intro__sub-item img { width: 100%;
 object-fit: cover; }

/* ギャラリー（メイン画像クリック→モーダル、サブ画像クリック→メイン切替） */
.pd-gallery__main {
  position: relative;
  cursor: pointer;
  overflow: hidden;
}
.pd-gallery__zoom-icon {
  position: absolute;
  bottom: 24px;
  right: 24px;
  width: 20px;
  height: 20px;
  pointer-events: none;
}
.pd-gallery__zoom-icon svg {
  width: 20px;
  height: 20px;
}

/* 右カラム：情報 */
.pd-intro__info-col {
  flex: 1;
  padding-top: 5px;
  display: flex;
  flex-direction: column;
}
.pd-intro__en-label {
  font-size: 13px;
  font-weight: 400;
  letter-spacing: 0.12em;
  color: #999;
  margin-bottom: 8px;
}
.pd-intro__title {
  font-size: 40px;
  font-weight: 500;
  color: #231815;
  letter-spacing: 0.04em;
  line-height: 1.3;
  margin: 0 0 24px;
  padding-bottom: 20px;
  border-bottom: 1px solid #d0d0d0;
}

/* スペックタグ 2×2グリッド */
.pd-intro__tags {
  display: flex;
  flex-direction: column;
  gap: 15px;
  padding-left: 20px !important;
}
.pd-intro__tag {
	list-style-type: disc;
}
.pd-intro__tag-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pd-intro__tag-icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}
.pd-intro__tag-icon svg {
  width: 40px;
  height: 40px;
}
.pd-intro__tag-text {
  font-size: 18px;
  font-weight: 500;
  color: #282828;
  letter-spacing: 0.04em;
  line-height: 1.5;
  margin: 0;
}
.pd-intro__tag-label {
  font-size: 11px;
  color: #888;
  letter-spacing: 0.04em;
  margin: 0 0 2px;
}
.pd-intro__tag-value {
  font-size: 19px;
  font-weight: 500;
  color: #231815;
  letter-spacing: 0.04em;
  line-height: 1.2;
  margin: 0;
}
.pd-intro__desc {
  font-size: 18px;
  line-height: 29px;
  color: #282828;
  font-weight: 500;
  letter-spacing: 0.04em;
  margin: 24px 0 0;
  background: #FBF6F6;
  padding: 18px;
}
.pd-intro__desc li {
	padding-left: 1em;
	text-indent: -1em;
}
.pd-intro__icons {
	display: flex;
	flex-wrap: wrap;
	margin-top: 40px !important;
}
.pd-intro__icon {
	width: 75px;
	margin-right: 10px;
	margin-bottom: 14px;
}
.pd-intro__dl-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: #a72126;
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.06em;
  padding: 15px 28px;
  text-decoration: none;
  align-self: flex-start;
  transition: opacity 0.2s;
}
.pd-intro__dl-btn:hover { opacity: 0.8; }
.pd-intro__dl-btn svg { flex-shrink: 0; }

/* -----------------------------------------------
   セクション共通
----------------------------------------------- */
.pd-section {
  padding: 100px 0 125px;
  background: #fff;
}
.pd-section--pink { background: #fbf6f6; }
.pd-section--gray  { background: #ededed; }
.pd-section__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
}
.pd-section__inner.pd-section__inner--1800 {
  max-width: 1800px;
}

.pd-section__inner.u-flex {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 80px;
}

.pd-section__flexContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 80px;
}
.pd-section__inner.u-flex.u-flex--jcfs {
	align-items: flex-start;
}
.pd-section__inner.u-flex-r {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: center;
	gap: 80px;
}


.pd-feature-card__header.u-mt100 { margin-top: 100px; }


.pd-section__inner--large {
	max-width: 1880px;
	margin: 0 auto;
	padding: 0 20px;
}

.pd-section__inner.u-mt100 {
	margin-top: 100px;
  }
.pd-section__inner.u-mt70 {
	margin-top: 70px;
  }
/* セクションタイトル */
.pd-section-title {
  font-size: 38px;
  font-weight: 500;
  color: #282828;
  letter-spacing: 0.06em;
  line-height: 1.5;
  text-align: center;
  margin: 0 0 50px;
}
.pd-section-lead {
  font-size: 15px;
  color: #555;
  text-align: center;
  line-height: 1.9;
  letter-spacing: 0.04em;
  margin: -30px 0 40px;
}

/* -----------------------------------------------
   カラーラインアップ
----------------------------------------------- */
.pd-color-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(212px, calc(50% - 8px)), 1fr));
  gap: 60px 16px;
}
.pd-color-list.u-center {
  grid-template-columns: repeat(auto-fit, minmax(min(212px, calc(50% - 8px)), 212px));
  width: fit-content;
  margin-inline: auto;
}
.pd-color-list--2col { grid-template-columns: repeat(2, 212px); width: fit-content; margin-inline: auto; }
.pd-color-list--3col { grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); max-width: 668px; margin-inline: auto; }
.pd-color-list--5col { grid-template-columns: repeat(auto-fill, minmax(212px, 1fr)); max-width: 1124px; margin-inline: auto; }
.pd-color-item { text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 228px;
}
.pd-color-item__img {
  width: 100%;

  aspect-ratio: 212/118;
  overflow: hidden;
  background: #e5e5e5;
}
.pd-color-item__img img { width: 100%; height: 100%; object-fit: cover; }
.pd-color-item__name {
  font-size: 16px;
  color: #000;
  letter-spacing: 0.04em;
  margin: 6px 0 0;
  line-height: 1.4;
}
.pd-color-note {
  font-size: 13px;
  color: #888;
  margin: 18px 0 0;
  line-height: 1.8;
}

/* HBJBのみ */
.pd-color-listContainer {
	display: flex;
	justify-content: center;
	gap: 86px;
}

.pd-color-listWrap {
	min-width: 0;
}

.pd-color-listWrap .pd-diagram-item__caption {
	margin: 0 auto 30px;
	max-width: 390px;
	width: 100%;
	display: grid;
	place-content: center;
}

.pd-color-listContainer .pd-color-list--2col {
	grid-template-columns: repeat(2, minmax(0, 212px));
	width: 100%;
}

@media screen and (max-width: 768px) {
	.pd-color-listContainer {
		flex-direction: column;
		gap: 40px;
	}
	.pd-color-listWrap .pd-diagram-item__caption {
		margin: 0 auto 20px;
		max-width: 300px;
		width: 100%;
	}

}

.intro__anchor-list {
	max-width: 1400px;
	margin: 0 auto 24px !important;
	padding: 0 20px !important;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}

.intro__anchor-item {
	border: 1px solid #A72126;
	border-radius: 5px;
	width: calc((100% - 32px) / 3);
	height: 78px;
}

.intro__anchor-item-link {
	height: 100%;
	width: 100%;
	transition: .4s;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.intro__anchor-item-link:hover {
	opacity: .8;
}
.intro__anchor-item-link .text {
	display: flex;
	align-items: center;
	font-size: 18px;
	font-weight: 500;
}
.intro__anchor-item-link .text::before {
	width: 40px;
	height: 32px;
	display: block;
	content: "";
	background: url(../../../../images/building-materials/product/common/icon-catalog.png) center center / contain;
	background-repeat: no-repeat;
	margin-left: 13px;
	margin-right: 18px;

}
.intro__anchor-item-link.u-cad .text::before {
	width: 45px;
	height: 36px;
	background: url(../../../../images/building-materials/product/common/icon-cad.png) center center / contain;
	background-repeat: no-repeat;
	margin-left: 14px;
	margin-right: 5px;

}
.intro__anchor-item-link.u-info .text::before {
	width: 21px;
	height: 26px;
	background: url(../../../../images/building-materials/product/common/icon-info.png) center center / contain;
	background-repeat: no-repeat;
	margin-left: 23px;
	margin-right: 18px;
}
.intro__anchor-item-link.u-fire .text::before {
	width: 35px;
	height: 35px;
	background: url(../../../../images/building-materials/product/common/icon-fire.png) center center / contain;
	background-repeat: no-repeat;
	margin-left: 20px;
	margin-right: 16px;
}
.intro__anchor-item-link.u-movie .text::before {
	width: 16.5px;
	height: 19.5px;
	background: url(../../../../images/building-materials/product/common/icon-movie.png) center center / contain;
	background-repeat: no-repeat;
	margin-left: 29px;
	margin-right: 18px;
}
.intro__anchor-item-link .arrow {
	height: 100%;
	display: grid;
	width: 67px;
	background: #A72126;
	place-content: center;
}
.intro__anchor-item-link .arrow::after {
	width: 7px;
	height: 13px;
	display: block;
	content: "";
	background: url(../../../../images/building-materials/product/common/arrow-w.png) center center / contain;
	background-repeat: no-repeat;
}
.intro__anchor-item-link.u-cad .arrow::after {
	width: 20px;
	height: 20px;
	display: block;
	content: "";
	background: url(../../../../images/building-materials/product/common/icon-zoom-w.png) center center / contain;
	background-repeat: no-repeat;
}



/* -----------------------------------------------
   製品特長
----------------------------------------------- */
.pd-feature-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-top: 100px;
}
.pd-feature-card {
  padding: 63px 54px 65px;
  position: relative;
  background: #FBF6F6;
}
.pd-feature-card__header {
  display: flex;
flex-direction: column;
align-items: center;
  gap: 20px;
  width: fit-content;
  margin: 0 auto;
  margin-bottom: 30px;
}

.pd-feature-card__header.u-taleft {
	align-items: flex-start;
	margin-left: 0;
}
.pd-feature-card__num {
  width: 55px;
  height: 55px;
  border-radius: 50%;
  background: #A72126;
  line-height: 1;
  color: #fff;
  font-size: 30px;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 3px;
  position: absolute;
  top: -27px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 2;
}
.pd-feature-card__num.u-static {
	position: static;
	transform: translateX(0);

  }
.pd-feature-card__title {
  font-size: 36px;
  font-weight: 500;
  color: #282828;
  letter-spacing: 0.04em;
  line-height: 1.6;
  margin-bottom: 35px;
}
.pd-feature-card__header.u-bdRed {
  border-bottom: 1px solid #A72126;
}
.pd-feature-card__title span {
  font-size: 22px;
  font-weight: 500;
  color: #282828;
  letter-spacing: 0.04em;
  line-height: 1.6;
 margin-top: 20px;
}
.pd-feature-card__title.u-center {
text-align: center;
}
/* .pd-feature-card__body { padding: 0 26px 26px; } */

.pd-feature-card__point-desc {
	margin-top: 38px;
	font-size: 16px;
	line-height: 28px;
	padding-left: 1em;
	text-indent: -1em;
}
.pd-feature-card__point-desc02 {
	margin-top: 46px;
	font-size: 18px;
	line-height: 36px;
	padding-left: 1em;
	text-indent: -1em;
}
.pd-feature-card__point-desc.u-mt35 {
	margin-top: 35px;
}
.pd-feature-card__point-desc.u-mt46 {
	margin-top: 46px;
}
.pd-feature-card__point-desc.u-mt13 {
	margin-top: 13px;
}
.pd-feature-card__point-desc.u-mt0 {
	margin-top: 0;
}

.pd-feature-card__body {
	display: flex;
	flex-direction: column;
	align-items: center;
}
.pd-feature-card__body.u-arrow::after {
	display: block;
	content: "";
	width: 55px;
	height: 46.5px;
	background: url(../../../../images/building-materials/product/common/arrow-down.png) center center / contain;
	background-repeat: no-repeat;
	margin-top: 28px;
	margin-bottom: 18px;

}
.pd-feature-card__text {
	width: 100%;
	text-align: left;
  font-size: 22px;
  font-weight: 500;
  line-height: 1.5;
  color: #282828;
  letter-spacing: 0.04em;
  margin-bottom: 25px;
}
.pd-feature-card__text.u-fz26 {
  font-size: 26px;
}
.pd-feature-card__text span {
  font-weight: 500;
  line-height: 1.5;
  color: #282828;
font-size: 20px;
}
.pd-feature-card__img { margin: 0 0 16px;
	background: #fff;
padding: 30px;
}
.pd-feature-card__img img { width: 100%; }
.pd-feature-card__point {
	 background: #fff;
	 padding: 30px;
	 max-width: 1000px;
	 margin: 0 auto;
	 margin-top: 40px;
	}
	.pd-feature-card__point.u-pink {
		background: #FBF6F6;
	   }
	.pd-feature-card__point.u-large {
		max-width: 1030px;
	   }
.pd-feature-card__point.u-mt70 {
	 margin-top: 70px;
	}
.pd-feature-card__point-label {
  display: inline-block;
  background: #a72126;
  color: #fff;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.1em;
  width: 96px;
  height: 36px;
  display: grid;
  place-content: center;
  border-radius: 22px;
  margin-bottom: 16px;
}
.pd-feature-card__point-list {
	padding-left: 20px !important;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.pd-feature-card__point-list li {
  font-size: 20px;
  font-weight: 500;
  line-height: 1.85;
  color: #282828;
  letter-spacing: 0.03em;
	list-style: disc !important;

}



.pd-feature__img {
	max-width: 1245px;
	margin: 0 auto !important;
}

.fireproof_features_lineup_imageWrap {
	width: 100%;
	position: relative;
	overflow: hidden;
	transition: .4s;
  }

  .fireproof_features_lineup_imageWrap:hover {
	opacity: .8;
  }


  .fireproof_features_lineup_ttlWrap {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
  }
  .fireproof_features_lineup_ttl {
	color: #fff;
	font-size: min(2.2vw, 40px);
	font-weight: 500;
	white-space: nowrap;
	letter-spacing: 0.04em;
	text-align: center;
  }
/* -----------------------------------------------
   施工・各種納まり図
----------------------------------------------- */
.pd-diagram-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 46px;
}
.u-border {
	border: 1px solid #868686;
}
.u-borderRed {
	border: 1px solid #A72126;
}
.u-w433 {
	max-width: 433px;
	justify-self: start;
}
.pd-diagram-grid--1col { grid-template-columns: 1fr; margin: 0 auto;}
.pd-diagram-grid--1col.u-w700 { max-width: 700px;}
.pd-diagram-grid--1col.u-bm3 { height: fit-content; width: 45%; max-width: 609px;}

.pd-diagram-grid--2col { grid-template-columns: auto auto; width: fit-content; margin-inline: auto; }
.pd-diagram-grid--3col { grid-template-columns: repeat(3, 1fr); gap: 30px; }
.pd-diagram-grid--4col { grid-template-columns: repeat(4, 1fr); gap: 30px; }


.pd-diagram-item {
  display: flex;
  flex-direction: column;
  min-width: 0;
  position: relative;
}
.pd-diagram-item__ttl-inner {
  flex: 1;
  box-sizing: border-box;
  background: #A72126;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 26px;
  font-weight: 500;
  text-align: center;
  gap: 40px;
}
.pd-diagram-item__ttl-inner p {
  margin: 0;
}
.u-invisible {
  visibility: hidden;
  pointer-events: none;
}
.pd-diagram-grid--2col.u-arrow {gap: 138px;}
.pd-diagram-grid--3col.u-arrow {gap: 74px;}
.pd-diagram-grid--2col .pd-diagram-item__img.u-arrow::after {
    display: block;
    content: "";
    width: 46.5px;
    height: 55px;
    background: url(../../../../images/building-materials/product/common/arrow-down.png) center center / contain;
    background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	right: -120px;
	transform: rotate(-90deg) translateY(-50%);
}
.pd-diagram-grid--3col .pd-diagram-item__img.u-arrow::after {
    display: block;
    content: "";
    width: 27px;
    height: 23px;
    background: url(../../../../images/building-materials/product/common/arrow-right.png) center center / contain;
    background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	right: -54px;
	transform: translateY(-50%);
}
.pd-diagram-item__img {
  background: #fff;
  padding: 30px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  flex: 1;
  box-sizing: border-box;
  position: relative;
}
.pd-diagram-item__img.u-p0 {
	padding: 0;
  }
.pd-diagram-item__img img {
  width: 100%;
  height: auto;
  object-fit: contain;
}
.pd-diagram-item__caption {
	display: inline-block;
	width: fit-content;
  white-space: nowrap;
  font-size: min(1.43vw, 20px);
  font-weight: 500;
  text-align: center;
  color: #282828;
  letter-spacing: 0.04em;
  line-height: 1.5;
  border: 1px solid #A72126;
  border-radius: 35px;
  padding: 12px 22px;
  margin: 0 auto;
  margin-bottom: 40px;
}

.pd-diagram-item__caption.u-p0 {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
padding: 0 22px;
min-height: 47px;
}

.pd-diagram-item__caption span {
  font-size: min(1.07vw, 15px);
}

.pd-diagram-item__caption.u-bdBlack {
	border: 1px solid #282828;
	padding: 12px 32px;

}

.pd-diagram-item__caption.u-mb20 {
	margin-bottom: 20px;
}
.pd-diagram-item__caption.u-w220 {
	width: 220px;
	display: grid;
	place-content: center;
}
.pd-full-img img { width: 100%; margin-top: 20px; }
.pd-note-list { margin: 14px 0 0; }
.pd-note-list li {
  font-size: 12px;
  color: #888;
  line-height: 1.85;
  letter-spacing: 0.03em;
}

/* -----------------------------------------------
   工法ステップ
----------------------------------------------- */
.pd-method-steps {
  display: flex;
  gap: 0;
  align-items: flex-start;
}
.pd-method-step {
  flex: 1;
  text-align: center;
  padding: 0 30px;
  position: relative;
}
.pd-method-step + .pd-method-step::before {
  content: '';
  position: absolute;
  left: 0; top: 24px;
  width: 1px; height: 48px;
  background: #d0d0d0;
}
.pd-method-step__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px; height: 46px;
  background: #a72126;
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  border-radius: 50%;
  margin-bottom: 14px;
}
.pd-method-step__img { margin-bottom: 12px; }
.pd-method-step__text {
  font-size: 13px;
  color: #444;
  line-height: 1.8;
  letter-spacing: 0.04em;
  text-align: left;
  margin: 0;
}

/* -----------------------------------------------
   建物全面の納まり
----------------------------------------------- */
.pd-building-types {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 22px;
}
.pd-building-type { background: #fbf6f6; padding: 24px; }
.pd-building-type__title {
  font-size: 17px;
  font-weight: 500;
  color: #231815;
  letter-spacing: 0.04em;
  margin: 0 0 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid #d0d0d0;
}
.pd-building-type__img img { width: 100%; }

/* -----------------------------------------------
   仕様
----------------------------------------------- */
.pd-spec__content {
  display: flex;
  gap: 50px;
  align-items: flex-start;
  margin-bottom: 40px;
}
.pd-spec__img-col { flex: 0 0 44%; }
.pd-spec__img img { width: 100%; }
.pd-spec__table-col { flex: 1; display: flex;
flex-direction: column;}
.pd-spec-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 20px;
  color: #282828;
  letter-spacing: 0.04em;
}
.pd-spec-table th,
.pd-spec-table td {
  border: 1px solid #282828;
  padding: 22px 24px 22px 47px;
  background: #fff;
  line-height: 1.7;
  vertical-align: middle;
}
.pd-spec-table th {
  font-weight: 500;
  text-align: left;
  white-space: nowrap;
  width: 16%;
  min-width: fit-content;
}
.pd-spec__full-img { overflow-x: auto; }
.pd-spec__full-img img { min-width: 600px; width: 100%; }

/* 軒天出幅別 */
.pd-specs-item__caption {
	text-align: center;
	font-size: min(1.57vw, 22px);
	font-weight: 500;
	color: #282828;
	margin-bottom: 20px;
	white-space: nowrap;
}
.pd-specs-item__caption span {
	font-size: min(1.14vw, 16px);
}

.pd-specs-item__img {
	padding: 0 30px;
	background: #fff;
	height: 240px;
	display: grid;
	place-content: center;
}
.pd-specs-item__img.u-h404 {
	height: 404px;
}
.pd-specs-item__img.u-hauto {
	padding: 30px;
	height: auto;
}
.pd-specs-item__img.u-h483 {
	height: 483px;

}


.pd-specs-border {
	margin: 65px 0 42px;
	color: #B4B4B4;
}

/* -----------------------------------------------
   関連製品
----------------------------------------------- */
.pd-related-list { display: flex; gap: 18px; }
.pd-related-list + .pd-related-list {
	margin-top: 20px;
}
.pd-related-item { flex: 1; }
.pd-related-item__link {
  display: flex;
  flex-direction: column;
  background: #fbf6f6;
  padding: 16px 18px 46px;
  position: relative;
  text-decoration: none;
  height: 100%;
  transition: opacity 0.2s;
}
.pd-related-item__link:hover { opacity: 0.85; }
.pd-related-item__name {
  font-size: 17px;
  font-weight: 500;
  color: #231815;
  letter-spacing: 0.04em;
  margin: 0 0 10px;
}
.pd-related-item__img { margin-bottom: 10px; }
.pd-related-item__text {
  font-size: 12px;
  color: #666;
  letter-spacing: 0.04em;
  line-height: 1.7;
  margin: 0;
  flex-grow: 1;
}
.pd-related-item__arrow {
  width: 10px; height: 10px;
  border-top: 2px solid #a72126;
  border-right: 2px solid #a72126;
  position: absolute;
  bottom: 20px; right: 18px;
  transform: rotate(45deg);
}

/* -----------------------------------------------
   ダウンロード
----------------------------------------------- */
.pd-download__list {
  display: flex;
  gap: 18px;
  flex-wrap: wrap;
  justify-content: center;
}
.pd-download__item { width: calc(33.33% - 12px); min-width: 200px; }
.pd-download__item-link {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid #d0d0d0;
  text-decoration: none;
  transition: border-color 0.2s;
}
.pd-download__item-link:hover { border-color: #a72126; }
.pd-download__item-icon { flex-shrink: 0; width: 30px; }
.pd-download__item-icon img { width: 30px; }
.pd-download__item-name {
  font-size: 13px;
  color: #231815;
  letter-spacing: 0.04em;
  line-height: 1.55;
  margin: 0;
}

.un_fs_modal {
	padding: 30px;
	max-width: 1200px;
	max-height: 90vh;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.un_fs_modal_img {
	display: block;
	max-width: 100%;
	max-height: calc(90vh - 60px);
	width: auto;
	height: auto;
	object-fit: contain;
}

.un_bm_product_intro_heading {
	margin-bottom: 0 !important;
}

.un_bm_product_intro {
	padding-bottom: 0 !important;
}

/* -----------------------------------------------
   汎用ズームモーダル（.pd-zoom クラスを付けたfigureで使用）
----------------------------------------------- */
.pd-zoom {
  position: relative;
  cursor: pointer;
}

/* SP（768px以下）のみポップアップ */
.pd-zoom--sp {
  position: relative;
}
.pd-zoom--sp .pd-zoom__icon {
  display: none;
}
.pd-specs-item__caption--sp {
	display: none;
}
@media screen and (max-width: 768px) {
	.u-mt130 {
		margin-top: 80px !important;
	}
	.u-mt120 {
		margin-top: 80px !important;
	}
	.u-mt100 {
		margin-top: 60px !important;
	}
	.u-mt80 {
		margin-top: 40px !important;
	}
  .pd-zoom--sp {
    cursor: pointer;
  }
  .pd-zoom--sp .pd-zoom__icon {
    display: block;
  }

  .pd-specs-item__caption--sp {
	display: block;
	background: #E8E8E8;
	border-radius: 23.5px;
	font-size: 14px;
	font-weight: 500;
	padding: 6px 10px;
	margin-top: 15px;
	margin-left: auto;
  }
}
.pd-zoom__icon {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 36px;
  height: 36px;
  pointer-events: none;
  background: url(../../../../images/building-materials/product/common/icon-zoom.png) center center / contain;
  background-repeat: no-repeat;
}
.pd-feature-card__img .pd-zoom__icon {
	position: absolute;
  bottom: 0;
  right: 0;
  width: 36px;
  height: 36px;
  }

.pd-zoom-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.pd-zoom-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.pd-zoom-modal {
  background: #fff;
  max-width: 90vw;
  max-height: 90vh;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
}
.pd-zoom-modal__close {
  position: absolute;
  top: 4px;
  right: 4px;
  background: none;
  border: none;
  font-size: 25px;
  font-weight: bold;
  cursor: pointer;
  color: #282828;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  z-index: 1;
}
.pd-zoom-modal__close:hover { opacity: 0.7; }
.pd-zoom-modal__body {
  padding: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pd-zoom-modal__img {
  display: block;
  max-width: 100%;
  max-height: calc(90vh - 60px);
  width: auto;
  height: auto;
  object-fit: contain;
}

/* -----------------------------------------------
   CADデータ モーダル
----------------------------------------------- */
.pd-cad-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.pd-cad-overlay.is-open {
  opacity: 1;
  pointer-events: auto;
}
.pd-cad-modal {
  background: #fff;
  width: 90%;
  max-width: 1440px;
  padding: 80px 20px 60px;
  position: relative;
  border-radius: 2px;
}
.pd-cad-modal-inner {
  max-width: 928px;
  margin: 0 auto;
}
.pd-cad-modal__x-btn {
  position: absolute;
  top: 14px;
  right: 14px;
  background: none;
  border: none;
  font-size: 22px;
  cursor: pointer;
  color: #333;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.pd-cad-modal__x-btn:hover { opacity: 0.7; }
.pd-cad-modal__label {
  text-align: center;
  font-size: 15px;
  color: #888;
  margin: 0 0 10px;
  letter-spacing: 0.06em;
}
.pd-cad-modal__product {
  text-align: center;
  font-size: 34px;
  font-weight: 700;
  color: #282828;
  letter-spacing: 0.04em;
  margin: 0 0 24px;
  line-height: 1.3;
}
.pd-cad-modal__divider {
  border: none;
  border-top: 1px solid #A72126;
  margin: 0 0 24px;
}
.pd-cad-modal__file-list {
  list-style: none;
  padding: 0;
  margin: 0 0 28px;
  font-size: 15px;
  color: #444;
  line-height: 1.8;
}
.pd-cad-modal__dl-row {
  display: flex;
  justify-content: space-between;
  /* gap: 50px; */
  margin-bottom: 36px !important;
  margin-top: 119px !important;
}
.pd-cad-modal__dl-row .intro__anchor-item{
 width: calc(50% - 25px);
}
.pd-cad-modal__dl-btn {
  flex: 1;
  display: flex;
  align-items: center;
  border: 1px solid #d0d0d0;
  text-decoration: none;
  color: #231815;
  overflow: hidden;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.04em;
  transition: opacity 0.2s;
  height: 60px;
}
.pd-cad-modal__dl-btn:hover { opacity: 0.75; }
.pd-cad-modal__dl-icon {
  width: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pd-cad-modal__dl-text {
  flex: 1;
  padding: 0 8px;
}
.pd-cad-modal__dl-arrow {
  width: 52px;
  height: 100%;
  background: #a72126;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.pd-cad-modal__close-btn {
  display: block;
  margin: 0 auto;
  width: 220px;
  padding: 14px 0;
  background: #c8c8c8;
  color: #231815;
  font-size: 16px;
  font-weight: 500;
  border: none;
  cursor: pointer;
  border-radius: 3px;
  letter-spacing: 0.06em;
  transition: opacity 0.2s;
}
.pd-cad-modal__close-btn:hover { opacity: 0.75; }


.pd-section__innerWrap {
	width: calc(55% - 80px);
}

/* === pd-img-slider === */
.pd-img-slider {
  width: 100%;
}

.pd-img-sliderWrap {
	max-width: 620px;
	width: 44%;
}
.pd-img-slider__viewport {
  position: relative;
  overflow: hidden;
}
.pd-img-slider__track {
  display: flex;
  transition: transform 0.35s ease;
  will-change: transform;
}
.pd-img-slider__slide {
  flex: 0 0 100%;
  min-width: 0;

}
.pd-img-slider__slide .pd-diagram-item__img {
  flex: none;
  width: 100%;
}
.pd-img-slider__btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 50px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pd-img-slider__btn--prev { left: 10px; }
.pd-img-slider__btn--next { right: 10px; }
.pd-img-slider__btn::after {
  content: '';
  display: block;
  width: 18px;
  height: 18px;
  border-color: #fff;
  border-style: solid;
  border-width: 0;
}
.pd-img-slider__btn--prev::after {
  border-left-width: 3px;
  border-bottom-width: 3px;
  transform: rotate(45deg) translateX(4px);
}
.pd-img-slider__btn--next::after {
  border-right-width: 3px;
  border-top-width: 3px;
  transform: rotate(45deg) translateX(-4px);
}
.pd-img-slider__dots {
  display: flex;
  justify-content: center;
  gap: 10px;
  padding: 14px 0 0;
}
.pd-img-slider__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ccc;
  border: none;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}
.pd-img-slider__dot.is-active {
  background: #333;
}



@media screen and (max-width: 768px) {
  .pd-cad-modal { padding: 48px 24px 36px; }
  .pd-cad-modal__product { font-size: 24px; }
  .pd-cad-modal__dl-row { flex-direction: column; gap: 12px; }
  .pd-cad-modal__dl-btn { height: 54px; }
  .pd-cad-modal__close-btn { width: 100%; }
}

/* -----------------------------------------------
   レスポンシブ
----------------------------------------------- */
@media screen and (max-width: 1000px) {
  .pd-intro { padding: 0 30px; margin-top: 30px; }
  .pd-intro__inner {
	flex-direction: column;
	gap: 35px; }

  .intro__anchor-item {
    width: calc(50% - 8px);
  }

  .pd-intro__main-img {
	margin-bottom: 14px !important;
  }
  .pd-intro__title { font-size: 30px; }
  .pd-section { padding: 65px 30px; }
  /* .pd-section-title { font-size: 24px; margin-bottom: 36px; } */
  .pd-diagram-grid--4col { grid-template-columns: 1fr 1fr; }
  .pd-method-step { padding: 0 16px; }
  .chemicals-linkArea {
	max-width: 400px;
	margin: 0 auto;
margin-top: 40px;

  }
  .chemicals-linkArea p {
	font-size: 18px;

  }
}

@media screen and (max-width: 768px) {
	.u-invisible {
	display: none;
	  }
	.u-mt60 {
		margin-top: 30px;
	}

	figcaption {
		font-size: 15px;
	}

	.un_bm_product_intro_label {
		margin-bottom: 16px !important;
		font-size: 14px !important;
	}
  /* イントロ */
  .pd-intro { padding: 0 20px;
margin-top: 20px;
margin-bottom: 75px;
}

.pd-section__inner--large {
	padding: 0;
}

.pd-cad-modal__dl-row .intro__anchor-item{
	width: 100%;
   }

  .pd-intro__inner { flex-direction: column; gap: 38px; padding: 0; margin-bottom: 47px;}
  .pd-intro__img-col { flex: none; width: 100%; }
  .pd-intro__info-col { width: 100%; padding-top: 0; }
  .pd-intro__title { font-size: 26px; margin-bottom: 18px; padding-bottom: 16px; }
  .pd-intro__tags { gap: 16px; }
  .pd-intro__tag { padding: 0;
font-size: 16px; line-height: 26.6px;}
  .pd-intro__tag-value { font-size: 16px; }
  .pd-intro__desc {
	font-size: 14px;
	padding: 15px;
	margin: 30px 0 0;
}
  .pd-intro__dl-btn { align-self: stretch; justify-content: center; font-size: 13px; padding: 14px 20px; }
  .pd-intro__sub-list { gap: 14px; }
  .pd-intro__icons {
	margin-top: 23px;
	gap: 10px;
	width: calc(100% + 10px);
	position: relative;
	right: 0;
  }
  .pd-intro__icon {
	width: calc((100% / 5) - 10px);
	margin-right: 0;
	margin-bottom: 0;
  }

  .intro__anchor-list {
	flex-direction: column;
	padding: 0 !important;
	gap: 20px;
	margin-bottom: 20px !important;
  }
  .intro__anchor-item {
	width: 100%;
	margin-right: 0 !important;
  }

  .pd-diagram-item__img {
	padding: 10px;
  }

  .intro__anchor-item-link .text {
	font-size: 16px;
  }
  .pd-intro__tag-text {
	font-size: 16px;
  }

  /* セクション共通 */
  .pd-section { padding: 60px 20px 75px; }
  .pd-section--pink.u-sub {
	background: #fff;
  }
  .u-sub .pd-section__inner {
	background: #FBF6F6;
	position: relative;
	padding: 57px 18px 45px;
  }
  .u-sub .pd-section__inner .pd-feature-card__num {
	position: absolute;
	transform: translateX(-50%);
  }

  .pd-section__inner.u-flex {
	flex-direction: column;
	align-items: center;
	gap: 40px;
}

.pd-section__flexContainer {
	flex-direction: column;
	align-items: center;
	gap: 40px;
}
  .pd-section__inner.u-flex-r {
	flex-direction: column;
	align-items: center;
	gap: 40px;
}
  .pd-section-title { font-size: 22px; margin-bottom: 45px; }
  .pd-section-lead { font-size: 14px; margin: -16px 0 28px; }
  .pd-section__inner {
	padding: 0;
  }

  /* カラー */
  .pd-color-list,
  .pd-color-list--2col,
  .pd-color-list--3col,
  .pd-color-list--5col {
	grid-template-columns: repeat(auto-fill, minmax(min(212px, calc(50% - 8px)), 1fr));
	width: 100%;
	margin-inline: 0;
	gap: 30px 16px;
}
  .pd-color-list--2col {
	grid-template-columns: repeat(auto-fit, minmax(min(212px, calc(50% - 8px)), 1fr));
	justify-content: center;
}

.pd-color-item {
	max-width: 100%;
}

.pd-color-item__name { font-size: 14px; }

  /* 製品特長 */
  .pd-feature-grid { grid-template-columns: 1fr;margin-top: 88px; }
  .pd-feature-card__header { margin-bottom: 10px; }
  .pd-feature-card__header.u-mt100 { margin-top: 50px; }
  .pd-feature-card__num { width: 55px; height: 55px; font-size: 30px; }
  .pd-feature-card__title { font-size: 18px;
text-align: center;
margin-bottom: 30px; }
  .pd-feature-card__title.u-sp22 { font-size: 22px; }

  .pd-feature-card__title span {
	font-size: 18px;
  }
  /* .pd-feature-card__body { padding: 0 20px 20px; } */
  .pd-feature-card__text { font-size: 16px;margin-bottom: 10px; }

  .pd-feature-card__text.u-fz26 {
	font-size: 16px;
  }
  .pd-feature-card {
	padding: 57px 18px 45px;
  }

  .pd-feature-card + .pd-feature-card {
	margin-top: 73px;
  }

  .pd-feature-card__img .pd-zoom__icon {
	width: 35px;
	height: 35px;
	bottom: 6px;
	right: 6px;
  }

  .pd-zoom__icon {
	width: 36px;
	height: 36px;
	right: 12px;
	bottom: 9px;
  }

  .pd-feature-card__img {
	padding: 10px;
  }

  .chemicals-linkArea p {
	font-size: 14px;
  }
  .chemicals-linkArea {
	height: 55px;
  }
  .chemicals-arrow {
	height: 32px;
  }
  .pd-feature-card__body.u-arrow::after {
    width: 32px;
    height: 27px;
    margin-top: 24px;
    margin-bottom: 18px;}

	.pd-feature-card__point.u-pink {
		background: #fff;
	}

	.pd-feature-card__point.u-mt70 {
		margin-top: 45px;
	}

	.pd-feature-card__point {
		padding: 37px 20px 45px;
	}
	.pd-feature-card__point-label {
		margin: 0 auto 23px;
	}

	.pd-feature-card__point-list li {
		font-size: 14px;
	}

	.pd-feature-card__point-desc {
		margin-top: 24px;
		font-size: 14px;
	}
	.pd-feature-card__point-desc02 {
		margin-top: 30px;
		font-size: 14px;
	}

  /* 工法 */
  .pd-method-steps { flex-direction: column; gap: 24px; }
  .pd-method-step { padding: 0; }
  .pd-method-step + .pd-method-step::before { display: none; }

  /* ダイアグラム */
  .pd-diagram-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .pd-diagram-grid--1col { grid-template-columns: 1fr;  }
  .pd-diagram-grid--1col.u-bm3 { width: 100%;}
  .pd-diagram-grid--2col { grid-template-columns: 1fr; gap: 48px;}
  .pd-diagram-grid--3col { grid-template-columns: 1fr; gap: 48px;}
  .pd-diagram-grid--4col { grid-template-columns: 1fr; gap: 18px;}
  .pd-diagram-grid--4col.u-gapLarge { grid-template-columns: 1fr; gap: 45px;}
  .pd-diagram-grid--2col.u-arrow {gap: 80px;}
  .pd-diagram-grid--3col.u-arrow {gap: 80px;}


  .pd-diagram-item {
	position: relative;
  }


  .pd-diagram-item__ttl-inner {
	flex: none;
	padding: 36px 15px;
	font-size: 20px;
	gap: 12px;
  }

  .pd-diagram-item.u-w300 {
	max-width: 300px;
	margin: 0 auto;
  }

  .pd-diagram-grid--2col .pd-diagram-item__img.u-arrow::after {
	width: 32px;
	height: 27px;
	top: auto;
	bottom: -50px;
	left: 50%;
	right: auto;
	transform: translateX(-50%);
}
  .pd-diagram-grid--3col .pd-diagram-item__img.u-arrow::after {
	width: 27px;
	height: 32px;
	top: auto;
	bottom: -60px;
	left: 50%;
	right: auto;
	transform: rotate(90deg) translateX(-50%);
}

  .pd-diagram-item__caption { font-size: 14px; padding: 8px 16px; margin-bottom: 20px;}
  .pd-diagram-item__caption.u-p0 { padding: 0px 16px;}
  .pd-diagram-item__caption span { font-size: 12px;}
  .pd-diagram-item__img.u-p0 {
	border: none;
  }
  .pd-diagram-item__img.u-filter {
	padding: 20px 0 20px 20px;
	background: rgba(0, 0, 0, 0.03);
  }
  .pd-diagram-item__img.u-filter .pd-zoom__icon {
	bottom: 20px;
  }

  .pd-specs-item__caption {
	font-size: 16px;
  }
  .pd-specs-item__img {
	padding: 20px;
	height: auto !important;
  }

  .pd-related-item {
	aspect-ratio: 310 / 150;
  }

  .fireproof_features_lineup_ttl {
font-size: 26px;
  }

  .pd-specs-border {
	margin: 50px 0;
  }

  /* 建物全面 */
  .pd-building-types { grid-template-columns: 1fr; }

  /* 仕様 */
  .pd-spec__content { flex-direction: column; gap: 24px; }
  .pd-spec__img-col { flex: none; width: 100%; }
  .pd-spec-table { font-size: 14px; }
  .pd-spec-table th { padding: 14px 10px; text-align: center; vertical-align: middle;}
  .pd-spec-table td { padding: 14px; vertical-align: middle;}
  .pd-spec-size-grid { grid-template-columns: 1fr; gap: 14px; }

  /* 関連製品 */
  .pd-related-list { flex-direction: column; gap: 14px; }
  .pd-related-item__name { font-size: 15px; }
  .fireproof_features_lineup_image {
    aspect-ratio: 310 / 150;
    object-fit: cover;
  }

  /* ダウンロード */
  .pd-download__list { flex-direction: column; gap: 10px; }
  .pd-download__item { width: 100%; min-width: 0; }

  .pd-img-sliderWrap {
	width: 100%;
}
.pd-section__innerWrap {
	width: 100%;
}
}