@charset "UTF-8";

/*===============================
common
===============================*/
img {
	width: 100%;
}
.component-block {
	padding-top: 50px;
}


/* pc */
@media (min-width: 768px) {
	.content-wrap {
		margin: 0 auto;
		padding-bottom: 30px;
		width: 640px;
		background: #FFF;
		box-shadow: 16px 0px 15px -15px rgb(0 0 0 / 50%), -16px 0px 15px -15px rgb(0 0 0 / 50%);
	}
	body {
		width: 100%;
		background: url(../../hrt-brsht/css/img/bg-pc.webp) no-repeat;
		background-attachment: fixed;
		background-size: cover;
	}
	#pageTop p {
		padding-left: 8px;
	}
}

/*===============================
cv
===============================*/
.btn-set {
	top: 56.5%;
	left: 6.6%;
	width: 88.4%;
}
.btn-single-sh {
	top: 82%;
	left: 7.6%;
	width: 43.6%;
}
.btn-single-ht {
	top: 82%;
	right: 6.2%;
	width: 43.7%;
}
.btn-other-3set {
	top: 59.5%;
	left: 7.3%;
	width: 86.8%;
}
.btn-other-hohm {
	top: 69.7%;
	left: 7.3%;
	width: 43.8%;
}
.btn-other-rf {
	top: 69.7%;
	right: 5.0%;
	width: 44.7%;
}
.btn-other-sct {
	top: 80.0%;
	left: 7.3%;
	width: 43.8%;
}
.btn-other-series {
	top: 90.2%;
	left: 12.4%;
	width: 76.5%;
}


/* single buy  */


/* pc */
@media (min-width: 768px) {
	.ov {
		transition: 200ms;
	}
	.ov:hover {
		opacity: .8;
		transition: 200ms;
	}
}


/* LINE相談ボタン */
.line-cta-button {
  display: block;
  width: 712px;
  max-width: 100%;
  aspect-ratio: 712 / 142;
  margin: 20px auto;
  background-image: url(../img/cta_button.webp);
  background-repeat: no-repeat;
  background-size: cover; 
  background-position: center;

  /* 中のテキストを非表示にする */
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

/* ホバーした時のスタイル */
.line-cta-button:hover {
  background-image: url(../img/cta_button_hover.webp);
}


/*サンプルページボタン */
.link-button {
  display: block;
  width: 712px;
  max-width: 100%;
  aspect-ratio: 712 / 142;
  margin: 20px auto;
  background-image: url(../img/link.webp);
  background-repeat: no-repeat;
  background-size: cover; 
  background-position: center;

  /* 中のテキストを非表示にする */
  text-indent: 100%;
  white-space: nowrap;
  overflow: hidden;
}

/* ホバーした時のスタイル */
.link-button:hover {
  background-image: url(../img/link_hover.webp);
}