@charset "utf-8";

/* ==========================================================================
   /highlow/ — ハイクオリティーの秘密
   ========================================================================== */

.r-renewal--highlow .r-highlow-hi {
	margin: 0;
	padding: 0 0 1.5em;
	background-color: #efe7da;
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-hi {
		padding: 0 0 2.2rem;
	}
}




.r-renewal--highlow .r-highlow-hi__box,
.r-renewal--highlow .r-highlow-low__box {
	--r-highlow-hi-radius: 24px;
	padding: 0 30px 36px;
	border-radius: 0 var(--r-highlow-hi-radius) 0 var(--r-highlow-hi-radius);
	overflow: hidden;
}

.r-renewal--highlow .r-highlow-hi__title,
.r-renewal--highlow .r-highlow-low__title {
	margin: 0 -32px 3em;
}

.r-renewal--highlow .r-highlow-hi__title picture,
.r-renewal--highlow .r-highlow-hi__title img,
.r-renewal--highlow .r-highlow-low__title picture,
.r-renewal--highlow .r-highlow-low__title img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 0 var(--r-highlow-hi-radius) 0 0;
}

.r-renewal--highlow .r-highlow-hi__body {
		display: flex;
		flex-direction: column;
		gap: .5em;
	align-items: start;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-hi__body {
		display: grid;
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 1.5em .9em;
		margin: 0 .8em;
	}
}



.r-renewal--highlow .r-highlow-hi__lead,
.r-renewal--highlow .r-highlow-hi__desc {
	margin: 0;
	font-family: var(--r-font-base);
	font-size: 1em;
	/* font-weight: bold; */
	color: #673a1b;
    line-height: 1.3em;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-hi__desc {
		font-size: 1rem;
		line-height: 1.5em;
	}
}

.r-renewal--highlow .r-highlow-hi__lead {
	font-size: 17px;
  font-weight: 600;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-hi__lead {
		font-size: 1.125rem;
		line-height: 1.555;
	}

}


.r-renewal [class*="__lead"] {
  line-height: 1.3em;
}
@media screen and (min-width: 799px) {
.r-renewal [class*="__lead"] {
  line-height: 1.6;
}

}



.r-renewal--highlow .r-highlow-hi__rule {
	display: block;
	width: 100%;
	height: 0;
	margin: 32px 0;
	padding: 0;
	border: none;
	border-top: 1px solid #6a3906;
}

.r-renewal--highlow .r-highlow-hi__photo {
	margin: 0;
}

.r-renewal--highlow .r-highlow-hi__photo img {
	display: block;
	width: 100%;
	height: auto;
}

.r-renewal--highlow .r-highlow-hi__photo--main {
	margin-bottom: 5px;
}

.r-renewal--highlow .r-highlow-hi__photo-row {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 6px;
}

.r-dash-box {
      padding: 0 34px 36px;
}

.r-lower-services__row--top .r-lower-services__btn:nth-child(1) {
  background: #8e3233;
  color: #fff;
  border: solid 1px #8e3233;
}

@media screen and (min-width: 1024px) {
	.r-renewal--highlow .r-highlow-hi__box,
	.r-renewal--highlow .r-highlow-low__box {
		width: min(100%,850px);
		margin-inline: auto;
	}

	.r-renewal--highlow .r-highlow-hi__rule {
		width: 80%;
		margin-inline: auto;
	}
}

@media screen and (max-width: 798px) {


	.r-renewal--highlow .r-highlow-hi__box,
	.r-renewal--highlow .r-highlow-low__box {
		--r-highlow-hi-radius: .8em;
		padding: 0 .85em 1em;
		border-radius: 0 var(--r-highlow-hi-radius) 0 var(--r-highlow-hi-radius);
	}

	.r-renewal--highlow .r-highlow-hi__title,
	.r-renewal--highlow .r-highlow-low__title {
		margin: 0 -1.2em 1.2em;
	}


	.r-renewal--highlow .r-highlow-hi__col--text,
	.r-renewal--highlow .r-highlow-hi__col--visual {
		display: contents;
	}

	.r-renewal--highlow .r-highlow-hi__photo--main {
		order: 1;
		margin-bottom: 0;
	}

	.r-renewal--highlow .r-highlow-hi__lead {
		order: 2;
		font-size: 1em;
	}

	.r-renewal--highlow .r-highlow-hi__rule {
		order: 3;
		margin: .35em 0;
	}

	.r-renewal--highlow .r-highlow-hi__photo-row {
		order: 4;
		grid-template-columns: minmax(0, 1fr);
		gap: 8px;
	}

	.r-renewal--highlow .r-highlow-hi__photo--pc-only {
		display: none;
	}

	.r-renewal--highlow .r-highlow-hi__desc {
		order: 5;
	}
}

/* ==========================================================================
   /highlow/ — 鑑定証（文字情報4行）
   ========================================================================== */

.r-renewal--highlow .r-highlow-cert {
	margin: 0;
	padding: 0 0 1.2em;
	background-color: #efe7da;
	text-align: center;
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-cert {
		padding-bottom: 2.8em;
	}
}




.r-renewal--highlow .r-highlow-cert__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .2em;
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-cert__inner {
		width: min(90%,800px);
		margin-inline: auto;
	}
}



.r-renewal--highlow .r-highlow-cert__catch {
	margin: 0;
	font-family: var(--r-font-base);
	font-size: 32px;
	font-weight: 900;
	letter-spacing: 0;
	color: #673a1b;
}


.r-renewal--highlow .r-highlow-cert__banner {
	display: inline-block;
	margin: 0;
	padding: .2em .3em;
	font-size: clamp(15px, calc(3.2vw + 4px), 1.1em);
	font-weight: 700;
	letter-spacing: 0.04em;
	line-height: 1.15;
	white-space: nowrap;
	color: #fff;
	background-color: var(--r-color-red);
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-cert__banner {
		margin-bottom: .25em;
		padding: .4em 1em;
		font-family: var(--r-font-base);
		font-size: 1.875rem;
		line-height: 1;
	}
}
.r-renewal--highlow .r-highlow-cert__note,
.r-renewal--highlow .r-highlow-cert__source {
	margin: 0;
	font-family: var(--r-font-base);
	font-size: 1.375rem;
	font-weight: 400;
	line-height: 1.4;
	letter-spacing: 0.04em;
	color: #673a1b;
}

.r-renewal--highlow .r-highlow-cert__source {
	font-size: 1em;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-cert__source {
		font-size: 1.25em;
	}
}


@media screen and (max-width: 798px) {

	.r-renewal--highlow .r-highlow-cert__inner {
		gap: 8px;
	}

	.r-renewal--highlow .r-highlow-cert__catch {
		font-size: 18px;
		font-weight: 900;
		letter-spacing: 0;
		line-height: 1.15;
		white-space: nowrap;
	}


	.r-renewal--highlow .r-highlow-cert__note {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: .3em;
		font-size: clamp(12px, 4.8vw, .92em);
		line-height: 1;
		letter-spacing: 0;
		margin: .4em auto 0;
	}

	.r-renewal--highlow .r-highlow-cert__note-line {
		white-space: nowrap;
	}

	.r-renewal--highlow .r-highlow-cert__source {
		font-size: 1em;
		line-height: 1.2;
		letter-spacing: 0;
	}
}

/* ==========================================================================
   /highlow/ — ロープライスの秘密
   ========================================================================== */

.r-renewal--highlow .r-highlow-low {
	margin: 0;
	padding: 0 0 1.4em;
	background-color: #efe7da;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-low {
		padding-bottom: 3.3em;
	}

}


.r-renewal--highlow .r-highlow-low__body {
	display: flex;
	flex-direction: column;
	gap: 12px;
	align-items: center;
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-low__body {
		display: grid;
		grid-template-columns: 1fr 42%;
		gap: 2.05em;
		width: 97%;
		margin-inline: auto;
	}
}





.r-renewal--highlow .r-highlow-low__desc {
	margin: 0;
	padding: 0 .57em;
	font-family: var(--r-font-base);
	font-size: 1em;
	font-weight: bold;
	line-height: 1.35;
	letter-spacing: 0.04em;
	color: #673a1b;
}

@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-low__desc {
		padding: 0 1.7em;
		font-size: 1.125rem;
		font-weight: 400;
		line-height: 1.777;
	}
}


.r-renewal--highlow .r-highlow-low__deco {
	position: relative;
	height: 30px;
}

.r-renewal--highlow .r-highlow-low__deco--start {
	margin-bottom: 16px;
}
@media screen and (min-width: 799px) {
	.r-renewal--highlow .r-highlow-low__deco--start {
		margin-bottom: -.7em;
	}

}




.r-renewal--highlow .r-highlow-low__deco--start::before,
.r-renewal--highlow .r-highlow-low__deco--start::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 60%;
	height: 1px;
	background-color: #e8d9c2;
}
@media screen and (min-width: 799px) {
.r-renewal--highlow .r-highlow-low__deco--start::before,
.r-renewal--highlow .r-highlow-low__deco--start::after {
	width: 100%;
}
}

.r-renewal--highlow .r-highlow-low__deco--start::after {
	width: 1px;
	height: 100%;
}

.r-renewal--highlow .r-highlow-low__deco--end {
	margin-top: 1em;
}

.r-renewal--highlow .r-highlow-low__deco--end::before,
.r-renewal--highlow .r-highlow-low__deco--end::after {
	content: '';
	position: absolute;
	bottom: 0;
	left: auto;
	right: 0;
	width: 60%;
	height: 1px;
	background-color: #e8d9c2;
}

@media screen and (min-width: 799px) {
.r-renewal--highlow .r-highlow-low__deco--end {
	margin-top: -.7em;
}

.r-renewal--highlow .r-highlow-low__deco--end::before,
.r-renewal--highlow .r-highlow-low__deco--end::after {
	width: 100%;
}	

}


.r-renewal--highlow .r-highlow-low__deco--end::after {
	right: 0;
	width: 1px;
	height: 100%;
}

.r-renewal--highlow .r-highlow-low__photo {
	margin: 0;
}

.r-renewal--highlow .r-highlow-low__photo img {
	width: 100%;
}




@media screen and (max-width: 798px) {


	.r-renewal--highlow .r-highlow-low__col--text,
	.r-renewal--highlow .r-highlow-low__col--visual {
		display: contents;
	}

	.r-renewal--highlow .r-highlow-low__text {
		order: 2;
		padding: 0;
	}

	.r-renewal--highlow .r-highlow-low__photo {
		order: 1;
	}

	.r-renewal--highlow .r-highlow-low__deco {
		height: 14px;
	}

	.r-renewal--highlow .r-highlow-low__deco--start {
		margin-bottom: 0;
	}

	.r-renewal--highlow .r-highlow-low__deco--end {
		margin-top: 0;
	}


}

/* =========================================================
   スクロールインアニメーション（全媒体共通）
   発火: body.is-loaded ＋ 各セクション（data-r-animate）の is-inview
   ========================================================= */

/* --- グループA：ハイクオリティの理由 --- */
.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__title,
.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__col--text,
.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__photo--main,
.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__photo-row {
	opacity: 0;
	transform: translateY(30px);
}

body.is-loaded .r-renewal--highlow .r-highlow-hi[data-r-animate].is-inview .r-highlow-hi__title {
	animation: r-anim-fade-up 0.8s ease 0s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-hi[data-r-animate].is-inview .r-highlow-hi__col--text {
	animation: r-anim-fade-up 0.8s ease 0.2s forwards;
  padding: 0 20px 0 0;
}

body.is-loaded .r-renewal--highlow .r-highlow-hi[data-r-animate].is-inview .r-highlow-hi__photo--main,
body.is-loaded .r-renewal--highlow .r-highlow-hi[data-r-animate].is-inview .r-highlow-hi__photo-row {
	animation: r-anim-fade-up 0.8s ease 0.4s forwards;
}

/* --- グループB：品質を支える強調コピー（鑑定証） --- */
.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__catch,
.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__note,
.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__source {
	opacity: 0;
}

.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__note,
.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__source {
	transform: scale(0.9);
}

.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__banner {
	opacity: 0;
	clip-path: inset(0 100% 0 0);
}

body.is-loaded .r-renewal--highlow .r-highlow-cert[data-r-animate].is-inview .r-highlow-cert__catch {
	animation: r-anim-fade-in 0.8s ease 0s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-cert[data-r-animate].is-inview .r-highlow-cert__banner {
	animation: r-anim-slide-reveal-left 0.8s ease 0.2s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-cert[data-r-animate].is-inview .r-highlow-cert__note {
	animation: r-anim-zoom-in 0.8s ease 0.4s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-cert[data-r-animate].is-inview .r-highlow-cert__source {
	animation: r-anim-zoom-in 0.8s ease 0.6s forwards;
}

/* --- グループC：ロープライスの秘密 --- */
.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__title,
.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__desc,
.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__photo,
.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__deco--end {
	opacity: 0;
	transform: translateY(30px);
}

.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__deco--start {
	opacity: 0;
	clip-path: inset(0 100% 0 0);
}

body.is-loaded .r-renewal--highlow .r-highlow-low[data-r-animate].is-inview .r-highlow-low__title {
	animation: r-anim-fade-up 0.8s ease 0s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-low[data-r-animate].is-inview .r-highlow-low__deco--start {
	animation: r-anim-slide-reveal-left 0.8s ease 0.2s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-low[data-r-animate].is-inview .r-highlow-low__desc {
	animation: r-anim-fade-up 0.8s ease 0.4s forwards;
}

body.is-loaded .r-renewal--highlow .r-highlow-low[data-r-animate].is-inview .r-highlow-low__photo,
body.is-loaded .r-renewal--highlow .r-highlow-low[data-r-animate].is-inview .r-highlow-low__deco--end {
	animation: r-anim-fade-up 0.8s ease 0.6s forwards;
}

@media (prefers-reduced-motion: reduce) {
	.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__title,
	.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__col--text,
	.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__photo--main,
	.r-renewal--highlow .r-highlow-hi[data-r-animate] .r-highlow-hi__photo-row,
	.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__catch,
	.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__banner,
	.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__note,
	.r-renewal--highlow .r-highlow-cert[data-r-animate] .r-highlow-cert__source,
	.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__title,
	.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__desc,
	.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__photo,
	.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__deco--start,
	.r-renewal--highlow .r-highlow-low[data-r-animate] .r-highlow-low__deco--end {
		opacity: 1;
		transform: none;
		clip-path: none;
		animation: none;
	}
}