#anchorContents .with-comparison .p-stories-detail-section__image {
	width: 100%;
}

#anchorContents div.comparison {
}

#anchorContents div.comparison figure {
	position: relative;
	width: 100%;
	height: auto;
	aspect-ratio: 880 / 393;
	margin: 0;
	background-size: cover;
	border-radius: 40px;
}

@media screen and (width <= 749px) {
	#anchorContents div.comparison figure {
		border-radius: 20px;
	}
}

#anchorContents div.comparison figure > img {
	position: relative;
	width: 100%;
}

#anchorContents div.comparison figure div {
	position: absolute;
	bottom: 0;
	width: 50%;
	height: 100%;
	overflow: hidden;
	background-size: cover;
	border-right: 1px solid #5a5962;
	border-radius: 40px 0 0 40px;
}

@media screen and (width <= 749px) {
	#anchorContents div.comparison figure div {
		border-radius: 20px 0 0 20px;
	}
}

.comparison.num01 figure {
	background-image: url(/jp-ja/design/assets/img/stories/stories-5/detail-3.jpg);
}

.comparison.num01 figure div {
	background-image: url(/jp-ja/design/assets/img/stories/stories-5/detail-4.jpg);
}

#anchorContents input[type="range"] {
	position: relative;
	top: 0;
	left: -2em;
	width: 104%;
	appearance: none;
	background-color: transparent;
	transform: translateY(-50%);
}

#anchorContents input[type="range"]:focus {
	outline: none;
}

#anchorContents input[type="range"]:active {
	outline: none;
}

#anchorContents input[type="range"]::-moz-range-track {
	position: relative;
	width: 98%;
	height: 15px;
	appearance: none;
	background-color: rgb(255 255 255 / 10%);
	outline: none;
}

#anchorContents input[type="range"]:active {
	border: none;
	outline: none;
}

#anchorContents input[type="range"]::-webkit-slider-thumb {
	width: 33px;
	height: 33px;
	appearance: none;
	background: url(/jp-ja/design/assets/img/stories/stories-5/icon_slide.svg)
		no-repeat center center / cover;
}

#anchorContents input[type="range"]::-moz-range-thumb {
	width: 20px;
	height: 15px;
	appearance: none;
	background: #fff;
	border-radius: 0;
}

#anchorContents .comparison-txt {
	display: flex;
	justify-content: space-between;
	margin-top: -20px;
}

@media screen and (width <= 959px) {
	#anchorContents input[type="range"] {
		left: 0;
		width: 100%;
	}
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel
	.p-stories-detail-section__image {
	width: 100%;
}

#anchorContents .p-stories-detail-section__imagebox.with-3dmodel figure {
	width: 100%;
	height: auto;
	aspect-ratio: 833 / 538;
}

#anchorContents .p-stories-detail-section__imagebox.with-3dmodel figcaption {
	color: #0765b9;
	text-align: center;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.p-stories-detail-section__image {
	width: 100%;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-otherImage {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-otherImage
	.bg-gas {
	display: flex;
	border-radius: 40px 0 0 40px;
}

@media screen and (width <= 749px) {
	#anchorContents
		.p-stories-detail-section__imagebox.with-3dmodel-pre
		.with-otherImage
		.bg-gas
		img {
		border-radius: 20px 0 0 20px;
	}
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-otherImage
	model-viewer {
	position: relative;
	background-color: #eaf2f6;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-otherImage
	model-viewer::after {
	position: absolute;
	right: 0;
	bottom: 0;
	display: block;
	width: 60px;
	height: 49px;
	content: "";
	background-image: url(/jp-ja/design/assets/img/stories/stories-5/360.png);
	background-repeat: no-repeat;
	background-size: 100%;
}

@media screen and (width <= 749px) {
	#anchorContents
		.p-stories-detail-section__imagebox.with-3dmodel-pre
		.with-otherImage
		model-viewer {
		border-radius: 0 20px 20px 0;
	}
}

@media screen and (width <= 749px) {
	#anchorContents
		.p-stories-detail-section__imagebox.with-3dmodel-pre
		.with-otherImage {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
	}
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-comment
	figure {
	position: relative;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-comment
	.fukidashi {
	position: absolute;
	bottom: 5px;
	left: 110px;
	width: 63.5%;
	opacity: 0;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-comment
	.fukidashi
	img {
	border-radius: unset;
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-comment.active
	.fukidashi {
	animation: fukidashiSlideIn 1.2s 0.8s ease-in-out forwards;
}

@keyframes fukidashiSlideIn {
	0% {
		clip-path: inset(0 100% 0 0);
	}

	100% {
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
}

@media screen and (width <= 749px) {
	#anchorContents
		.p-stories-detail-section__imagebox.with-3dmodel-pre
		.with-comment
		.fukidashi {
		left: 24%;
	}
}

#anchorContents
	.p-stories-detail-section__imagebox.with-3dmodel-pre
	.with-comment
	.icon {
	position: absolute;
	bottom: 5px;
	left: 10px;
	width: 17%;

	/* width: 102px; */

	/* opacity: 0; */
}

@media screen and (width <= 749px) {
	#anchorContents
		.p-stories-detail-section__imagebox.with-3dmodel-pre
		.with-comment
		.icon {
		width: 20%;
	}
}

#anchorContents .degitalmodels-Box {
	display: flex;
	gap: 20px;
	justify-content: center;
	margin-top: 48px;
}

#anchorContents .degitalmodels-Box .degitalmodels-Box__item {
	opacity: 0;
	transform: translateY(50px);
}

#anchorContents .degitalmodels-Box.active .is-item01 {
	animation: fadeIn 1s 0.9s ease-in-out forwards;
}

#anchorContents .degitalmodels-Box.active .is-item02 {
	animation: fadeIn 0.9s ease-in-out forwards;
}

#anchorContents .degitalmodels-Box.active .is-item03 {
	animation: fadeIn 1.5s 0.9s ease-in-out forwards;
}

@media screen and (width <= 749px) {
	#anchorContents .degitalmodels-Box {
		margin-top: 20px;
	}
}

@keyframes fadeIn {
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}
