@charset "UTF-8";
/* CSS Document */


/*
=========================================
Original Layout
=========================================
*/

.header{
	background-color: #dce6f0;
}
main{
	background-color: #dce6f0;
}

/*
=========================================
Overall page layout --feature-snoopy
=========================================
*/

.feature-snoopy{
	font-size: 1.3rem;
	color: #4d84c3;
}
@media (max-width: 767px){
	.feature-snoopy{
		font-size: 1.2rem;
	}
}
.feature-snoopy .feature-character__product{
	color: initial;
}
.feature-snoopy .feature-character__product .products__size button{
	background-color: #dce6f0;
}
.feature-snoopy .feature-character__product .products__size button.active{
	background-color: #aab4a0;
}


/*
=========================================
feature-snoopy__fv
=========================================
*/

.feature-snoopy__fv{
	margin-bottom: 12.0rem;
}
@media (max-width: 767px){
	.feature-snoopy__fv{
		padding: 4.0rem 2.0rem 0;
		margin-bottom: 4.0rem;
	}
}


/*
=========================================
feature-kitty__intro
=========================================
*/

.feature-snoopy__intro{
	margin-bottom: 8.0rem;
}

.feature-snoopy__logo img{
	max-width: 53.0rem;
	width: 100%;
	margin-inline: auto;
	margin-bottom: 8.0rem;
}
@media (max-width: 767px){
	.feature-snoopy__logo img{
		width: 80%;
	}
}

.feature-snoopy__lead{
	display: grid;
}
.feature-snoopy__lead> * {
	grid-area: 1 / 1;
}


.feature-snoopy__lead .txt-wrap{
	width: 30%;
	margin-inline: auto;
}
@media (max-width: 999px){
	.feature-snoopy__lead .txt-wrap{
		width: 35%;
	}
}
@media (max-width: 767px){
	.feature-snoopy__lead .txt-wrap{
		width: 50%;
	}
}
@media (max-width: 599px){
	.feature-snoopy__lead .txt-wrap{
		width: 80%;
	}
}
.feature-snoopy__lead .txt-wrap div{
	position: sticky;
	top: 12.0rem;
}
.feature-snoopy__lead .txt-wrap div p{
	margin-bottom: 3.5rem;
	letter-spacing: 0.08em;
	line-height: 2.4;
	font-weight: 600;
}
@media (max-width: 599px){
	.feature-snoopy__lead .txt-wrap div p{
		margin-bottom: 3.0rem;
		line-height: 2.0;
	}
}
.feature-snoopy__lead .txt-wrap div p.en-txt{
	font-family: "futura-pt", sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 1.4rem;
	letter-spacing: normal;
	line-height: 1.6;
	text-align: justify;
}
@media (max-width: 599px){
	.feature-snoopy__lead .txt-wrap div p.en-txt{
		font-size: 1.3rem;
	}
}

.parallax-img{
	background-size: auto 124%;
	background-position: center 0%;
	background-repeat: no-repeat;
}

.img-wrap01{
	display: grid;
	gap: 10.0rem;
	padding-block: 15.0rem 40.0rem;
}
@media (max-width: 767px){
	.img-wrap01{
		gap: 14.0rem;
		padding-top: 20.0rem;
	}
}
.img-wrap01 .parallax-img{
	width: 30%;
	aspect-ratio: 5 / 7;
}
@media (max-width: 767px){
	.img-wrap01 .parallax-img{
		width: 40%;
		opacity: 0.8;
	}
}
@media (max-width: 599px){
	.img-wrap01 .parallax-img{
		width: 45%;
		opacity: 0.6;
	}
}
.img-wrap01 .parallax-img:nth-child(odd){
	margin-left: auto;
}
.img-wrap01 .parallax-img:nth-child(3){
	aspect-ratio: 6 /5;
	margin-top: -18.0rem;
}
@media (max-width: 767px){
	.img-wrap01 .parallax-img:nth-child(3){
		aspect-ratio: 6 /5;
		margin-top: 0;
	}
}

.img-wrap02{
	margin-top: 4.0rem;
}
.img-wrap02 .parallax-img{
	aspect-ratio: 10 / 7;
	width: 60%;
	background-size: auto 115%;
	background-position: left 0%;
}
@media (max-width: 767px){
	.img-wrap02 .parallax-img{
		width: 80%;
	}
}


/*
=========================================
feature-kitty__point
=========================================
*/

.feature-snoopy__point{
	position: relative;
	z-index: 0;
	margin-bottom: 8.8rem;
	padding-bottom: 8.0rem;
	font-weight: 500;
}
.feature-snoopy__point .bg-fixed-img{
	inset: 0 auto auto;
	z-index: -1;
	width: 100vw;
	height: 100vh;
	object-fit: cover;
	object-position: top center;
}
.feature-snoopy__inner{
	position: relative;
	z-index: 1;
}

.feature-snoopy__set{
	padding-top: 2.0rem;
	margin-bottom: 5.5rem;
}
.feature-snoopy__set.sp-none img{
	max-width: 86.7rem;
	width: 100%;
	margin-left: 2.0rem;
}
@media (max-width: 999px){
	.feature-snoopy__set.sp-none img{
		margin-left: 0;
		margin-inline: auto;
	}
}
@media (max-width: 767px){
	.feature-snoopy__set.pc-none img:first-of-type{
		width: 30%;
		margin-bottom: 1.0rem;
		margin-inline: auto;
	}
	.feature-snoopy__set.pc-none img:last-of-type{
		max-width: none;
		width: 100%;
		margin-inline: auto;
	}
}


.feature-snoopy__point-list{
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	column-gap: 3.2rem;
	row-gap: 4.0rem;
}
@media (max-width: 767px){
	.feature-snoopy__point-list{
		column-gap: 1.5rem;
	}
}
.feature-snoopy__point-list li{
	max-width: 20.2rem;
	width: 100%;
	text-align: center;
	font-size: 1.2rem;
	line-height: 1.4;
	padding-top: 1.0rem;
}
@media (max-width: 767px){
	.feature-snoopy__point-list li{
		width: calc(50% - 1.0rem);
	}
}
.feature-snoopy__point-list li img{
	margin-bottom: 1.0rem;
}