@charset "utf-8";
.js-scroll-class {
	transition: 1.5s cubic-bezier(0.75, 0, 0.35, 1);
	filter: saturate(0);
	opacity: 0;
}

.is-state-scroll {
	opacity: 1;
	filter: saturate(100%);
}

.g-container {
	position: relative;
}

.g-container:after {
	content: '';
	width: 100%;
	height: 100%;
	background: url("../img/bg-01.png");
	display: block;
	position: fixed;
	top: 0;
	left: 0;
}

.g-container__inner {
	position: relative;
	z-index: 10;
}

.g-container img {
	width: 100%;
	max-width: none;
	image-rendering: -webkit-optimize-contrast;
}

.l-kv {
	height: auto;
	margin: 124px 0 0;
	padding: 44.5% 0 0;
	background: transparent;
	position: relative;
}

.l-kv > * {
	position: relative;
	z-index: 10;
}

.l-kv:after {
	content: '';
	width: 58%;
	margin: 0 15% 0 0;
	padding: 25.5% 0 0;
	display: block;
	background: url("../img/bg-02.png") no-repeat right top / 100% 100%;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 0;
}

.l-kv__logo {
	width: 38%;
	display: flex;
	justify-content: center;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(0,-50%);
	z-index: 20;
}

.l-kv__logo em {
	width: 40%;
	padding: 0 3%;
}

.l-kv__image {
	width: 62%;
	position: absolute;
	top: 0;
	right: 0;
}

.l-kv__scroll {
	margin: 0 0 -10% 0;
	background: rgba(100,100,100,.15);
	position: absolute;
	bottom: 0;
	right: 10%;
	z-index: 100;
}

.l-kv__scroll:after {
	content: 'scroll';
	color: #897a70;
	font-size: 1rem;
	letter-spacing: .25em;
	position: absolute;
	bottom: 0;
	right: -.5em;
	transform-origin: right top;
	transform: translate(25%,100%) rotate(90deg);
}

.l-kv__scroll-wrap {
	width: 3px;
	height: 200px;
	display: block;
	position: relative;
	overflow: hidden;
}

.l-kv__scroll-bar {
	width: 100%;
	height: 100%;
	display: block;
	background: rgba(137,122,112,.75);
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(0,-100%);
	animation: anim-scrollLine__move 4s 1s ease-in-out infinite;
}

@keyframes anim-scrollLine__move {
	0% {
		transform: translate(0,-100%);
	}
	30% {
		transform: translate(0,0);
	}
	40% {
		transform: translate(0,0);
	}
	70% {
		transform: translate(0,100%);
	}
	100% {
		transform: translate(0,100%);
	}
}

.l-kurashi-style {
	margin: 9% 0 0;
	position: relative;
}

.l-kurashi-style > * {
	position: relative;
	z-index: 10;
}

.l-kurashi-style:before {
	content: '';
	width: 30%;
	margin: -16% 0 0;
	padding: 39% 0 0;
	background: url("../img/bg-03.png") no-repeat left top / 100% auto;
	position: absolute;
	top: 0;
	left: 0;
}

.l-kurashi-style:after {
	content: '';
	width: 30%;
	margin: 16% 0 0;
	padding: 37% 0 0;
	background: url("../img/bg-04.png") no-repeat left top / 100% auto;
	position: absolute;
	top: 0;
	right: 0;
}

.l-kurashi-style__title {
	text-align: center;
}

.l-kurashi-style__title img {
	width: 32.5%;
}

.l-kurashi-style__catch {
	text-align: center;
	margin: 6.5% 0 0;
}

.l-kurashi-style__catch img {
	width: 46.5%;
}

.l-kurashi-style-feature {
	margin: 5% 0 0;
	padding: 0 8%;
}

.l-kurashi-style-feature__items {
	display: flex;
	justify-content: center;
}

.l-kurashi-style-feature__item {
	width: calc(100% / 3);
	padding: 5.5% 0 0;
	position: relative;
}

.l-kurashi-style-feature__item > * {
	position: relative;
	z-index: 10;
}

.l-kurashi-style-feature__item:after {
	content: '';
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%,0);
	z-index: 0;
}

.l-kurashi-style-feature__item:nth-child(1) {
	color: #876262;
	margin: 0 -3% 0 0;
	transform: translate(0,-30%);
}

.l-kurashi-style-feature__item:nth-child(1):after {
	height: 118%;
	margin: 0 0 0 2%;
	background: url("../img/ks-03.png") no-repeat center / 100% 100%;
}

.l-kurashi-style-feature__item:nth-child(2) {
	color: #626f87;
	z-index: 10
}

.l-kurashi-style-feature__item:nth-child(2):after {
	width: 118%;
	height: 110%;
	background: url("../img/ks-04.png") no-repeat center / 100% 100%;
}

.l-kurashi-style-feature__item:nth-child(3) {
	color: #6d8762;
	margin: 0 0 0 -2%;
	transform: translate(0,-27%);
	z-index: 20;
}

.l-kurashi-style-feature__item:nth-child(3):after {
	height: 122%;
	background: url("../img/ks-05.png") no-repeat center / 100% 100%;
}

.l-kurashi-style__read {
	color: #a79e9a;
	font-size: 1.3vw;
	font-weight: 700;
	line-height: 2;
	text-align: center;
	letter-spacing: .35em;
	margin: 2.5% 0 0;
}

.l-kurashi-style-feature h4 {
	text-align: center;
}

.l-kurashi-style-feature h4 img {
	width: 30%;
}

.l-kurashi-style-feature p {
	font-size: 1.2vw;
	line-height: 1.75;
	text-align: center;
	margin: 5% 0 0;
}

.l-kurashi-plus {
	margin: 12% 0 0;
	position: relative;
}

.l-kurashi-plus:after {
	content: '';
	width: 45%;
	margin: -9% 0 0;
	padding: 39% 0 0;
	background: url("../img/bg-05.png") no-repeat left top / 100% auto;
	position: absolute;
	top: 0;
	left: 0;
}

.l-kurashi-plus__inner {
	width: 64%;
	margin: 0 auto;
	padding: 25.5% 0 0;
	background: url("../img/plus-03.jpg") no-repeat top center / 100% 100%;
	position: relative;
	overflow: hidden;
	box-shadow:
		0 0 5px 0 #fff,
		0 0 10px 0 #fff,
		0 0 10px 0 #fff,
		0 0 10px 0 #fff,
		0 0 30px 0 #fff,
		0 0 60px 0 #fff
	;
	z-index: 10;
}

.l-kurashi-plus__inner:after {
	content: '';
	width: 40%;
	padding: 40% 0 0;
	display: block;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 65%);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	opacity: .15;
}

.l-kurashi-plus__wrap {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

.l-kurashi-plus__title {
	text-align: center;
	margin: 7.5% 0 0;
}

.l-kurashi-plus__title img {
	width: 50%;
}

.l-kurashi-plus__catch {
	text-align: center;
	margin: 2% 0 0;
}

.l-kurashi-plus__catch img {
	width: 35%;
}

.l-kurashi-plus__read {
	color: #fff;
	font-size: 1.2vw;
	font-weight: 700;
	text-align: center;
	letter-spacing: .25em;
	margin: 3% 0 0;
}

.l-voice {
	margin: 25% 0 0;
	background: #fff;
	position: relative;
}

.l-voice:after {
	content: '';
	width: 100%;
	padding: 9.8% 0 0;
	display: block;
	background: url("../img/bg-06.svg") no-repeat top center / 100% auto;
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(0,-100%);
}

.l-voice__title {
	display: flex;
	justify-content: center;
	flex-direction: row-reverse;
	transform: translate(0,-31%);
	position: relative;
	z-index: 10;
}

.l-voice__title > * {
	margin-right: 1%;
	margin-left: 1%;
}

.l-voice__title > *:nth-child(1) {
	width: 1.8%;
}

.l-voice__title > *:nth-child(2) {
	width: 3.1%;
	margin-top: 3.25%;
}

.l-voice__title > *:nth-child(3) {
	width: 3.1%;
	margin-top: 5.7%;
}

.l-voice__items {
	margin: -10% 0 0;
	padding: 0 8% 20%;
	overflow: hidden;
}

.l-voice__item {
	margin: 13% 0 0 0;
	position: relative;
}

.l-voice__item:after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
}

.l-voice__item-inner {
	width: 47%;
	margin: 0 0 0 53%;
	position: relative;
	z-index: 10;
}

.l-voice__item-inner > h3 {
	width: 55%;
	position: relative;
}

.l-voice__item-inner > h3 img {
	position: relative;
	z-index: 10;
}

.l-voice__item-inner > h3:after {
	content: '';
	width: 38%;
	padding: 18% 0 0;
	display: block;
	background: url("../img/voice-title-00.png") no-repeat top center / 100% auto;
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-100%,0);
}

.l-voice__item-inner > p {
	font-size: 1.15vw;
	font-weight: 700;
	line-height: 1.75;
	text-align: justify;
	text-justify: inter-ideograph;
	width: 56%;
	margin: 5% 0 0;
}

.l-voice__item-inner > figure {
	width: 103%;
	margin: -3.5% 0 0 -3%;
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-100%,0);
}

.l-voice__item-inner > figure figcaption {
	width: 70%;
	position: absolute;
	bottom: 0;
	right: 0;
	z-index: 10;
}

.l-voice-data {
	width: 75%;
	margin: 3% 0 0;
	display: flex;
	justify-content: flex-end;
	align-items: center;
}

.l-voice-data > p {
	font-size: 1.2vw;
	font-weight: 700;
	padding: 0 1em 0 0;
}

.l-voice-data > figure {
	width: 25%;
}

.l-voice-data > figure img {
	border-radius: 50%;
}

.l-voice__item:nth-child(even):after {
	left: auto;
	right: 0;
}

.l-voice__item:nth-child(even) .l-voice__item-inner {
	margin: 0 0 0 20%;
}

.l-voice__item:nth-child(even) .l-voice__item-inner > figure {
	transform: translate(0,0);
	margin-left: 70%;
}

.l-voice__item:nth-child(even) .l-voice-data {
	margin-left: -5%;
}

.l-voice__item:nth-child(even) .l-voice__item-inner > h3:after {
	left: auto;
	right: 0;
	transform: translate(100%,0);
}

.l-voice__item:nth-child(1):after {
	width: 53%;
	margin: -7% 0 0 0;
	padding: 33% 0 0;
	background: url("../img/bg-07.png") no-repeat top center / 100% auto;
}

.l-voice__item:nth-child(1) .l-voice__item-inner > h3:after {
	margin: -12% 0 0 5%;
}

.l-voice__item:nth-child(1) .l-voice__item-inner > figure figcaption {
	margin: 0 -43% -2% 0;
}

.l-voice__item:nth-child(2):after {
	width: 48%;
	margin: -5% -6% 0 0;
	padding: 45% 0 0;
	background: url("../img/bg-08.png") no-repeat top center / 100% auto;
}

.l-voice__item:nth-child(2) .l-voice__item-inner > h3:after {
	margin: -10% 40% 0 0;
}

.l-voice__item:nth-child(2) .l-voice__item-inner > figure figcaption {
	margin: 0 8% -15% 0;
}

.l-voice__item:nth-child(3):after {
	width: 65%;
	margin: -8% 0 0 -15%;
	padding: 40% 0 0;
	background: url("../img/bg-09.png") no-repeat top center / 100% auto;
}

.l-voice__item:nth-child(3) .l-voice__item-inner > h3:after {
	margin: -12% 0 0 5%;
}

.l-voice__item:nth-child(3) .l-voice__item-inner > figure figcaption {
	margin: 0 -34% -6% 0;
}

.l-voice__item:nth-child(4):after {
	width: 48%;
	margin: -5% -6% 0 0;
	padding: 45% 0 0;
	background: url("../img/bg-10.png") no-repeat top center / 100% auto;
}

.l-voice__item:nth-child(4) .l-voice__item-inner > h3:after {
	margin: -23% 40% 0 0;
}

.l-voice__item:nth-child(4) .l-voice__item-inner > figure figcaption {
	margin: 0 14% -13% 0;
}

.l-voice__item:nth-child(5):after {
	width: 70%;
	margin: -1% 0 0 -7%;
	padding: 43% 0 0;
	background: url("../img/bg-11.png") no-repeat top center / 100% auto;
}

.l-voice__item:nth-child(5) .l-voice__item-inner > h3:after {
	margin: 6% 0 0 3%;
}

.l-voice__item:nth-child(5) .l-voice__item-inner > figure {
	margin-top: 2%;
}

.l-voice__item:nth-child(5) .l-voice__item-inner > figure figcaption {
	margin: 0 -11% -10% 0;
}

.l-lineup {
	padding: 0 0 15%;
	background: #fff;
}

.l-lineup__title {
	line-height: 1;
	text-align: center;
	margin: 0 8%;
	position: relative;
}

.l-lineup__title:after {
	content: '';
	width: 100%;
	height: 1px;
	background: #d8d1cb;
	display: block;
	position: absolute;
	top: calc(50% - .15em);
	left: 0;
}

.l-lineup__title em {
	width: 18%;
	padding: 0 .75em;
	display: inline-block;
	background: #fff;
	position: relative;
	z-index: 10;
}

.l-lineup__inner {
	width: 50%;
	margin: 0 auto;
}

.l-lineup__items {
	margin: 2% -3.5% 0;
	display: flex;
	flex-wrap: wrap;
}

.l-lineup__item {
	width: calc(100% / 2);
	margin: 5% 0 0;
	padding: 0 3.5%;
}

.l-lineup h3 {
	font-size: 1.3vw;
	font-weight: 700;
	text-align: center;
	margin: 1em 0 0;
}

.l-shop-search {
	padding: 5% 0;
	background: #a79e9a;
}

.l-shop-search__title {
	color: #fff;
	font-size: 1.45vw;
	font-weight: 700;
	letter-spacing: .15em;
	text-align: center;
}

.l-shop-search__button {
	text-align: center;
	margin: 2% 0 0;
}

.l-shop-search__button a {
	padding: 1.75em 7em;
	background: #fff;
	border-radius: .35em;
	display: inline-block;
}

.l-shop-search__button a em {
	font-size: 1.6vw;
	font-weight: 700;
	white-space: nowrap;
	padding: .15em 0 .15em 2em;
	background: url("../img/icon-search-01.png") no-repeat left center / auto 95%;
	display: inline-block;
}