@charset 'UTF-8';

/*----------------------------------------

	- mo_project
		- s01
		- s02
		- s03
		- s04
		- s05
		- s06
		- s07
		- s08
		- s09
	- slider
	- accordion
	- scroll effect

-----------------------------------------*/

/*----------------------------------------
	common
-----------------------------------------*/
.wrapper {
	min-width: unset;
}

#mo_project {
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing: 0 !important;
	opacity: 1 !important;
	transition: opacity 1s cubic-bezier(.33, .01, .02, .98);
	position: relative;
	background-color: var(--color-c10000);
	clip-path: inset(0);

	/* color */
	--color-default:#2B2B2B;
	--color-333:#333333;
	--color-999:#999999;
	--color-ccc:#CCCCCC;
	--color-inverse:#FFFFFF;
	--color-emphasis:#F20000;
	--color-c10000:#C10000;
	--color-secondary: #FBF3DE;
	--color-nav_primary: #FFFFAA;
	--color-nav_secondary: #FFE659;
	--font-montserrat: "Montserrat", sans-serif;
}

#mo_project::before {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: url(/img/usr/mo/specialedition-holidaycollection/2025/pc_bg.png);
	background-repeat: repeat-x;
	background-position: calc(50% - 855px) calc(50% + 55px);
	background-size: auto 400px;
	z-index: 0;
}

#mo_project .mo_project_contents {
	width: min(400px, 100%);
	margin-inline: auto;
	background-color: var(--color-c10000);
	position: relative;
	z-index: 1;
	padding-block-end: 64px;
}

#mo_project .mo_project_contents h1 {
	margin: 0;
	padding: 0;
	font-size: unset;
	font-weight: unset;
	position: relative;
	z-index: 1;
}

#mo_project .mo_project_contents img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

#mo_project .mo_project_contents .bold {
	font-weight: 700;
}

#mo_project .mo_project_contents .bold {
	font-weight: 700;
}

#mo_project .mo_project_contents .accent {
	color: var(--color-emphasis);
}

#mo_project .mo_project_contents .attention {
	display: flex;
	justify-content: center;
}

#mo_project .mo_project_contents .attention::before,
#mo_project .mo_project_contents .attention::after {
	content: "";
	display: block;
	height: 1lh;
	width: 1px;
	background-color: var(--color-default);
	margin-block: auto 0;
}

#mo_project .mo_project_contents .attention:has(br)::before,
#mo_project .mo_project_contents .attention:has(br)::after {
	height: 1.25lh;
}

#mo_project .mo_project_contents .attention::before {
	transform: rotate(-15deg);
	margin-inline: 0 1em;
}

#mo_project .mo_project_contents .attention::after {
	transform: rotate(15deg);
	margin-inline: 1em 0;
}

#mo_project .imglist {
	display: grid;
	gap: 16px;
	width: 330px;
	margin-inline: auto;
}

#mo_project .note li {
	display: grid;
	grid-template-columns: auto 1fr;
}

#mo_project .note li::before {
	content: "※";
}

@media (hover: hover) {
	#mo_project .imglist a {
		transition: opacity .3s;
	}

	#mo_project .imglist a:hover {
		opacity: .75;
	}
}

#mo_project .mo_project_contents .button {
	background-color: var(--color-333);
	color: var(--color-inverse);
	width: 280px;
	height: 51px;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-inline: auto;
	border-radius: 10em;
	position: relative;
	font-size: 1.6rem;
	line-height: 1.66;
	font-weight: 700;
	border: none;
}

#mo_project .mo_project_contents .button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 18px;
	transform: translateY(-50%) rotate(45deg);
	display: block;
	width: 10px;
	height: 10px;
	border-top: 2px solid var(--color-inverse);
	border-right: 2px solid var(--color-inverse);
}

@media (hover: hover) {
	#mo_project .mo_project_contents .button {
		transition: opacity .3s;
	}
	#mo_project .mo_project_contents .button:hover {
		opacity: .75;
	}
}

#mo_project .mo_project_contents .bg {
	position: relative;
	z-index: 1;
	padding-block-end: 104px;
}

#mo_project .mo_project_contents .bg::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 120px;
	background-image: url(/img/usr/mo/specialedition-holidaycollection/2025/header-bg.png);
	background-position: bottom;
	background-repeat: no-repeat;
	background-size: 100% auto;
	z-index: -1;
}

@media screen and (max-width: 600px) {
	#mo_project::before {
		display: none;
	}
}

@media screen and (max-width: 400px) {
	#mo_project .mo_project_contents {
		padding-block-end: 16vw;
	}

	#mo_project .imglist {
		gap: 4vw;
		width: 82.5vw;
	}

	#mo_project .mo_project_contents .button {
		width: 70vw;
		height: 12.75vw;
		font-size: 4vw;
	}

	#mo_project .mo_project_contents .button::after {
		right: 4.5vw;
		width: 2.5vw;
		height: 2.5vw;
	}

	#mo_project .mo_project_contents .bg {
		padding-block-end: 26vw;
	}

	#mo_project .mo_project_contents .bg::after {
		height: 30vw;
	}
}

/*----------------------------------------
	endtext
-----------------------------------------*/
#mo_project .endtext {
	background-color: var(--color-inverse);
	padding: 24px;
	position: relative;
	z-index: 3;
}

#mo_project .endtext p {
	color: var(--color-emphasis);
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.33;
	text-align: center;
	padding: 10px 20px;
	border: 2px solid var(--color-emphasis);
	width: min(800px, 100%);
	margin-inline: auto;
}

#mo_project .endtext p span {
	display: inline-block;
}

@media screen and (max-width: 600px) {
	#mo_project .endtext {
		padding: 5vw;
	}

	#mo_project .endtext p {
		font-size: 4vw;
		line-height: 1.66;
		padding: 1.6vw 5vw;
	}
}

/*----------------------------------------
	kv
-----------------------------------------*/
#mo_project #kv {
	padding-block-end: 104px;
}

#mo_project #kv ul {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 1px;
	border-radius: 8px;
	overflow: hidden;
	margin-block-start: 16px;
}

#mo_project #kv ul li {
	display: flex;
	justify-content: center;
	align-items: center;
}

#mo_project #kv ul li a {
	display: block;
	width: 100%;
	height: 100%;
	text-align: center;
	line-height: 0;
}

@media (hover: hover) {
	#mo_project #kv ul li a {
		transition: opacity .3s;
	}
	#mo_project #kv ul li a:hover {
		opacity: .5;
	}
}

#mo_project #kv ul li span:not(.accent) {
	color: var(--color-default);
}

#mo_project #kv ul li:nth-child(1) {
	grid-column: 1/3;
}

#mo_project #kv ul li:nth-child(2) {
	grid-column: 3/5;
}

#mo_project #kv ul li:nth-child(3) {
	grid-column: 1/3;
}

#mo_project #kv ul li:nth-child(4) {
	grid-column: 3/5;
}

/* 1-2 */
#mo_project #kv ul li:nth-child(-n+2) {
	background-color: var(--color-nav_primary);
}

#mo_project #kv ul li:nth-child(-n+2) a {
	padding-block: 14px 12px;
}

#mo_project #kv ul li:nth-child(-n+2) span:not(.accent) {
	font-size: 1.6rem;
	line-height: 1.33;
}

#mo_project #kv ul li:nth-child(-n+2) .accent {
	font-size: 1.8rem;
	line-height: 1.33;
}

/* 3-4 */
#mo_project #kv ul li:nth-child(3) a,
#mo_project #kv ul li:nth-child(4) a {
	padding-block: 12px 13px;
}

/* 3-8 */
#mo_project #kv ul li:nth-child(n+3) {
	background-color: var(--color-nav_secondary);
}

#mo_project #kv ul li:nth-child(n+3) span:not(.accent) {
	font-size: 1.2rem;
	line-height: 1.33;
}

#mo_project #kv ul li:nth-child(n+3) .accent {
	font-size: 1.4rem;
	line-height: 1.33;
}

/* 5-8 */
#mo_project #kv ul li:nth-child(n+5) a {
	padding-block: 9px 7px;
}

#mo_project #kv ul li:nth-child(n+5) span {
	display: block;
}

@media screen and (max-width: 400px) {
	#mo_project #kv {
		padding-block-end: 26vw;
	}

	#mo_project #kv ul {
		border-radius: 2vw;
		margin-block-start: 4vw;
	}

	/* 1-2 */
	#mo_project #kv ul li:nth-child(-n+2) a {
		padding-block: 3.5vw 3vw;
	}

	#mo_project #kv ul li:nth-child(-n+2) span:not(.accent) {
		font-size: 4vw;
	}

	#mo_project #kv ul li:nth-child(-n+2) .accent {
		font-size: 4.5vw;
	}

	/* 3-4 */
	#mo_project #kv ul li:nth-child(3) a,
	#mo_project #kv ul li:nth-child(4) a {
		padding-block: 3vw 3.25vw;
	}

	/* 3-8 */
	#mo_project #kv ul li:nth-child(n+3) span:not(.accent) {
		font-size: 3vw;
	}

	#mo_project #kv ul li:nth-child(n+3) .accent {
		font-size: 3.5vw;
	}

	/* 5-8 */
	#mo_project #kv ul li:nth-child(n+5) a {
		padding-block: 2.25vw 1.75vw;
	}
}

/*----------------------------------------
	s01 ホリデイ＆限定コスメ
-----------------------------------------*/
#mo_project #s01 h1 {
	margin-block: -64px -46px;
}

#mo_project #s01 .box01 {
	background-color: var(--color-inverse);
	padding-block: 48px 0;
	padding-inline: 8px;
}

#mo_project #s01 .box02 {
	background-color: var(--color-inverse);
	padding-block: 49px 0;
	padding-inline: 8px;
}

#mo_project #s01 .box01 p,
#mo_project #s01 .box02 p {
	font-size: 2rem;
	line-height: 1.33;
	text-align: center;
}

#mo_project #s01 .box01 .slider,
#mo_project #s01 .box02 .slider {
	margin-block-start: 16px;
}

#mo_project #s01 .box01 .button,
#mo_project #s01 .box02 .button {
	margin-block-start: 24px;
}

#mo_project #s01 .box01 .slider a,
#mo_project #s01 .box02 .slider a {
	display: grid;
}

@media (hover: hover) {
	#mo_project #s01 .box01 .slider a,
	#mo_project #s01 .box02 .slider a {
		transition: opacity .3s;
	}

	#mo_project #s01 .box01 .slider a:hover,
	#mo_project #s01 .box02 .slider a:hover {
		opacity: .5;
	}
}

#mo_project #s01 .box01 .slider .brand,
#mo_project #s01 .box02 .slider .brand {
	color: var(--color-999);
	font-size: 1.2rem;
	line-height: 1.33;
	margin-block-start: 8px;
}

#mo_project #s01 .box01 .slider .item,
#mo_project #s01 .box02 .slider .item {
	color: var(--color-default);
	font-size: 1.4rem;
	line-height: 1.33;
	margin-block-start: 6px;
	display: -webkit-box;
	overflow: hidden;
	text-overflow: ellipsis;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 4;
}

#mo_project #s01 .box01 .slider .value,
#mo_project #s01 .box02 .slider .value {
	color: var(--color-default);
	font-size: 1.2rem;
	line-height: 1.33;
	margin-block-start: 10px;
}

#mo_project #s01 .box01 .slider .value span,
#mo_project #s01 .box02 .slider .value span {
	font-size: 1.8rem;
	line-height: 1;
	margin-inline: 4px;
	font-family: var(--font-montserrat);
}

#mo_project #s01 .box03 {
	background-color: var(--color-inverse);
	padding-block: 48px 0;
}

#mo_project #s01 .box03 p {
	font-size: 1.6rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s01 .box03 ul {
	margin-block-start: 16px;
}

#mo_project #s01 .box04 {
	background-color: var(--color-inverse);
	padding-block: 33px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

#mo_project #s01 .box04 p {
	font-size: 1.6rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s01 .box04 ul {
	margin-block-start: 16px;
}

@media screen and (max-width: 400px) {
	#mo_project #s01 h1 {
		margin-block: -16vw -11.5vw;
	}

	#mo_project #s01 .box01 {
		padding-block: 12vw 0;
		padding-inline: 2vw;
	}

	#mo_project #s01 .box02 {
		padding-block: 12.25vw 0;
		padding-inline: 2vw;
	}

	#mo_project #s01 .box01 p,
	#mo_project #s01 .box02 p {
		font-size: 5vw;
	}

	#mo_project #s01 .box01 .slider,
	#mo_project #s01 .box02 .slider {
		margin-block-start: 4vw;
	}

	#mo_project #s01 .box01 .button,
	#mo_project #s01 .box02 .button {
		margin-block-start: 6vw;
	}

	#mo_project #s01 .box01 .slider .brand,
	#mo_project #s01 .box02 .slider .brand {
		font-size: 3vw;
		margin-block-start: 2vw;
	}

	#mo_project #s01 .box01 .slider .item,
	#mo_project #s01 .box02 .slider .item {
		font-size: 3.5vw;
		margin-block-start: 1.5vw;
	}

	#mo_project #s01 .box01 .slider .value,
	#mo_project #s01 .box02 .slider .value {
		font-size: 3vw;
		margin-block-start: 2.5vw;
	}

	#mo_project #s01 .box01 .slider .value span,
	#mo_project #s01 .box02 .slider .value span {
		font-size: 4.5vw;
		margin-inline: 1vw;
	}

	#mo_project #s01 .box03 {
		padding-block: 12vw 0;
	}

	#mo_project #s01 .box03 p {
		font-size: 4vw;
	}

	#mo_project #s01 .box03 ul {
		margin-block-start: 4vw;
	}

	#mo_project #s01 .box04 {
		padding-block: 8.25vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}

	#mo_project #s01 .box04 p {
		font-size: 4vw;
	}

	#mo_project #s01 .box04 ul {
		margin-block-start: 4vw;
	}
}

/*----------------------------------------
	s02 ホリデイギフトカード
-----------------------------------------*/
#mo_project #s02 h1 {
	margin-block: -64px -46px;
}

#mo_project #s02 .box01 {
	background-color: var(--color-inverse);
	padding-block: 40px 0;
}

#mo_project #s02 .box01 p:nth-child(1) {
	font-size: 1.8rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s02 .box01 p:nth-child(2) {
	font-size: 1.6rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s02 .box01 p:nth-child(3) {
	text-align: center;
}

#mo_project #s02 .box01 p:nth-child(3) span:nth-child(1) {
	font-size: 2.8rem;
	line-height: 1.33;
}

#mo_project #s02 .box01 p:nth-child(3) span:nth-child(2) {
	font-size: 2.4rem;
	line-height: 1.33;
}

#mo_project #s02 .box01 figure {
	width: 180px;
	margin-inline: auto;
	margin-block-start: 16px;
}

#mo_project #s02 .box02 {
	background-color: var(--color-inverse);
	padding-block: 32px;
	padding-inline: 12px;
}

#mo_project #s02 .box02 > p {
	font-size: 1.6rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s02 .box02 > dl {
	background-color: var(--color-secondary);
	width: 208px;
	display: grid;
	gap: 9px;
	margin-inline: auto;
	border-radius: 16px;
	overflow: hidden;
	margin-block-start: 16px;
	padding-block: 16px;
}

#mo_project #s02 .box02 > dl dt {
	font-size: 1.6rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s02 .box02 > dl dd {
	font-size: 2.4rem;
	line-height: 1;
	text-align: center;
	font-family: var(--font-montserrat);
}

#mo_project #s02 .box02 > .note {
	margin-block-start: 16px;
	width: fit-content;
	margin-inline: auto;
}

#mo_project #s02 .box02 > .note li {
	font-size: 1.4rem;
	line-height: 1.33;
}

#mo_project #s02 .box02 .button {
	margin-block-start: 25px;
}

#mo_project #s02 .box02 .accordion_content .item01 figure {
	margin-block-start: 23px;
	background-color: var(--color-secondary);
	padding-block: 32px;
	padding-inline: 28px;
	border-radius: 16px;
	overflow: hidden;
}

#mo_project #s02 .box02 .accordion_content .item01 figcaption {
	font-size: 1.4rem;
	line-height: 1.33;
	text-align: center;
}

#mo_project #s02 .box02 .accordion_content .item01 img {
	margin-block-start: 16px;
}

#mo_project #s02 .box02 .accordion_content .item01::after {
	content: "";
	display: block;
	width:0;
	height:0;
	border-style:solid;
	border-width: 16px 16px 0 16px;
	border-color: var(--color-c10000) transparent transparent transparent;
	margin-block-start: 16px;
	margin-inline: auto;
}

#mo_project #s02 .box02 .accordion_content .item02 {
	margin-block-start: 16px;
	background-color: var(--color-secondary);
	padding-block: 32px 35px;
	border-radius: 16px;
	overflow: hidden;
}

#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) {
	display: grid;
	grid-template-columns: 1.04fr 5px 1fr;
	padding-inline: 28px;
}

#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) figure {
	grid-column: 1/-1;
	grid-row: 1/2;
	position: relative;
	z-index: 1;
	margin-block-end: -7px;
}

#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) p {
	grid-column: 1/3;
	grid-row: 2/3;
	position: relative;
	z-index: 3;
	height: fit-content;
	margin-block: auto;
}

#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) div {
	grid-column: 2/4;
	grid-row: 2/3;
	position: relative;
	z-index: 2;
}

@media (hover: hover) {
	#mo_project #s02 .box02 .accordion_content .item02 a {
		transition: opacity .3s;
	}

	#mo_project #s02 .box02 .accordion_content .item02 a:hover {
		opacity: .75;
	}
}

#mo_project #s02 .box02 .accordion_content .item02 .noteWrap {
	margin-block-start: 16px;
	padding-inline: 24px;
}

#mo_project #s02 .box02 .accordion_content .item02 .noteWrap p {
	font-size: 1.4rem;
	line-height: 1.33;
}

#mo_project #s02 .box02 .accordion_content .item02 .noteWrap li {
	font-size: 1.4rem;
	line-height: 1.33;
}

#mo_project #s02 .box03 {
	background-color: var(--color-secondary);
	padding-block: 25px 31px;
	padding-inline: 16px;
	display: grid;
	grid-template-columns: min(96px, 100%) 1fr;
	gap: 16px 24px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

#mo_project #s02 .box03 figure {
	grid-column: 1/2;
	grid-row: 1/2;
	border-radius: 50%;
	overflow: hidden;
}

#mo_project #s02 .box03 p:nth-of-type(1) {
	height: fit-content;
	display: grid;
	gap: 4px;
	margin-block: auto;
}

#mo_project #s02 .box03 p:nth-of-type(1) span:nth-child(1) {
	font-size: 1.4rem;
	line-height: 1.66;
}

#mo_project #s02 .box03 p:nth-of-type(1) span:nth-child(2) {
	font-size: 2rem;
	line-height: 1.33;
}

#mo_project #s02 .box03 p:nth-of-type(2) {
	grid-column: 1/-1;
	grid-row: 2/3;
	font-size: 1.4rem;
	line-height: 1.66;
}

@media screen and (max-width: 400px) {
	#mo_project #s02 h1 {
		margin-block: -16vw -11.5vw;
	}

	#mo_project #s02 .box01 {
		padding-block: 10vw 0;
	}

	#mo_project #s02 .box01 p:nth-child(1) {
		font-size: 4.5vw;
	}

	#mo_project #s02 .box01 p:nth-child(2) {
		font-size: 4vw;
	}

	#mo_project #s02 .box01 p:nth-child(3) span:nth-child(1) {
		font-size: 7vw;
	}

	#mo_project #s02 .box01 p:nth-child(3) span:nth-child(2) {
		font-size: 6vw;
	}

	#mo_project #s02 .box01 figure {
		width: 45vw;
		margin-block-start: 4vw;
	}

	#mo_project #s02 .box02 {
		padding-block: 8vw;
		padding-inline: 3vw;
	}

	#mo_project #s02 .box02 > p {
		font-size: 4vw;
	}

	#mo_project #s02 .box02 > dl {
		width: 52vw;
		gap: 2.25vw;
		border-radius: 4vw;
		margin-block-start: 4vw;
		padding-block: 4vw;
	}

	#mo_project #s02 .box02 > dl dt {
		font-size: 4vw;
	}

	#mo_project #s02 .box02 > dl dd {
		font-size: 6vw;
	}

	#mo_project #s02 .box02 > .note {
		margin-block-start: 4vw;
	}

	#mo_project #s02 .box02 > .note li {
		font-size: 3.5vw;
	}

	#mo_project #s02 .box02 .button {
		margin-block-start: 6.25vw;
	}

	#mo_project #s02 .box02 .accordion_content .item01 figure {
		margin-block-start: 5.75vw;
		padding-block: 8vw;
		padding-inline: 7vw;
		border-radius: 4vw;
	}

	#mo_project #s02 .box02 .accordion_content .item01 figcaption {
		font-size: 3.5vw;
	}

	#mo_project #s02 .box02 .accordion_content .item01 img {
		margin-block-start: 4vw;
	}

	#mo_project #s02 .box02 .accordion_content .item01::after {
		border-width: 4vw 4vw 0 4vw;
		margin-block-start: 4vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 {
		margin-block-start: 4vw;
		padding-block: 8vw 8.75vw;
		border-radius: 4vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) {
		grid-template-columns: 1.04fr 1.25vw 1fr;
		padding-inline: 7vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 > div:nth-of-type(1) figure {
		margin-block-end: -1.75vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 .noteWrap {
		margin-block-start: 4vw;
		padding-inline: 6vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 .noteWrap p {
		font-size: 3.5vw;
	}

	#mo_project #s02 .box02 .accordion_content .item02 .noteWrap li {
		font-size: 3.5vw;
	}

	#mo_project #s02 .box03 {
		padding-block: 6.25vw 7.75vw;
		padding-inline: 4vw;
		grid-template-columns: 24vw 1fr;
		gap: 4vw 6vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}

	#mo_project #s02 .box03 p:nth-of-type(1) {
		gap: 1vw;
	}

	#mo_project #s02 .box03 p:nth-of-type(1) span:nth-child(1) {
		font-size: 3.5vw;
	}

	#mo_project #s02 .box03 p:nth-of-type(1) span:nth-child(2) {
		font-size: 5vw;
	}

	#mo_project #s02 .box03 p:nth-of-type(2) {
		font-size: 3.5vw;
	}
}

/*----------------------------------------
	s03 ランキングから探す
-----------------------------------------*/
#mo_project #s03 h1 {
	margin-block: -64px -46px;
}

#mo_project #s03 .box01 {
	background-color: var(--color-inverse);
	padding-block: 39px 31px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

#mo_project #s03 .box01 p {
	font-size: 1.8rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s03 .box01 ul {
	margin-block-start: 16px;
}

@media screen and (max-width: 400px) {
	#mo_project #s03 h1 {
		margin-block: -16vw -11.5vw;
	}

	#mo_project #s03 .box01 {
		padding-block: 9.75vw 7.75vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}

	#mo_project #s03 .box01 p {
		font-size: 4.5vw;
	}

	#mo_project #s03 .box01 ul {
		margin-block-start: 4vw;
	}
}

/*----------------------------------------
	s04 発売日から探す
-----------------------------------------*/
#mo_project #s04 h1 {
	margin-block: -64px 0;
}

#mo_project #s04 .box01 {
	margin-block-start: 8px;
}

#mo_project #s04 .box01 ul {
	display: grid;
	gap: 1px;
	border-radius: 8px;
	overflow: hidden;
}

#mo_project #s04 .box01 li {
	background-color: var(--color-inverse);
}

#mo_project #s04 .box01 li a {
	color: var(--color-default);
	display: flex;
	justify-content: center;
	align-items: center;
	margin-inline: auto;
	position: relative;
	font-size: 2rem;
	line-height: 1.33;
	padding-block: 20px;
}

#mo_project #s04 .box01 li a::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 20px;
	transform: translateY(-50%);
	display: block;
	width: 10px;
	height: 10px;
	border-top: 2px solid var(--color-emphasis);
	border-right: 2px solid var(--color-emphasis);
	rotate: 45deg;
}

@media (hover: hover) {
	#mo_project #s04 .box01 li a {
		transition: opacity .3s;
	}

	#mo_project #s04 .box01 li a:hover {
		opacity: .5;
	}
}

#mo_project #s04 .box02 {
	background-color: var(--color-secondary);
	padding-block: 32px;
	border-radius: 16px;
	overflow: hidden;
	margin-block-start: 16px;
}

#mo_project #s04 .box02 p {
	font-size: 1.8rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s04 .box02 ul {
	margin-block-start: 16px;
}

@media screen and (max-width: 400px) {
	#mo_project #s04 h1 {
		margin-block: -16vw 0;
	}

	#mo_project #s04 .box01 {
		margin-block-start: 2vw;
	}

	#mo_project #s04 .box01 ul {
		border-radius: 2vw;
	}

	#mo_project #s04 .box01 li a {
		font-size: 5vw;
		padding-block: 5vw;
	}

	#mo_project #s04 .box01 li a::after {
		right: 5vw;
		width: 2.5vw;
		height: 2.5vw;
	}

	#mo_project #s04 .box02 {
		padding-block: 8vw;
		border-radius: 4vw;
		margin-block-start: 4vw;
	}

	#mo_project #s04 .box02 p {
		font-size: 4.5vw;
	}

	#mo_project #s04 .box02 ul {
		margin-block-start: 4vw;
	}
}

/*----------------------------------------
	s05 ブランドから探す
-----------------------------------------*/
#mo_project #s05 {
	padding-block-end: 44px;
}

#mo_project #s05 h1 {
	margin-block: -64px 0;
}

#mo_project #s05 .box01 ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8.3px 9.5px;
	margin-block-start: 9px;
}

#mo_project #s05 .box01 li {
	background-color: var(--color-inverse);
}

@media (hover: hover) {
	#mo_project #s05 .box01 li a {
		transition: opacity .3s;
	}

	#mo_project #s05 .box01 li a:hover {
		opacity: .5;
	}
}

#mo_project #s05 .button {
	margin-block-start: 24px;
}

@media screen and (max-width: 400px) {
	#mo_project #s05 {
		padding-block-end: 11vw;
	}

	#mo_project #s05 h1 {
		margin-block: -16vw 0;
	}

	#mo_project #s05 .box01 ul {
		gap: 2.1vw 2.375vw;
		margin-block-start: 2.25vw;
	}

	#mo_project #s05 .button {
		margin-block-start: 6vw;
	}
}

/*----------------------------------------
	s06 価格から探す
-----------------------------------------*/
#mo_project #s06 {
	padding-block-end: 114px;
}

#mo_project #s06 h1 {
	margin-block: -4px 0;
}

#mo_project #s06 .box01 ul {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1px;
	border-radius: 8px;
	overflow: hidden;
	margin-block-start: 9px;
}

#mo_project #s06 .box01 li {
	background-color: var(--color-inverse);
}

#mo_project #s06 .box01 li a {
	color: var(--color-default);
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-inline: auto;
	font-size: 2rem;
	line-height: 1.33;
	padding-block: 16px;
	padding-inline: 24px 17px;
	height: 100%;
}

#mo_project #s06 .box01 li a::after {
	content: "";
	display: block;
	width: 10px;
	height: 10px;
	border-top: 2px solid var(--color-emphasis);
	border-right: 2px solid var(--color-emphasis);
	rotate: 45deg;
}

@media (hover: hover) {
	#mo_project #s06 .box01 li a {
		transition: opacity .3s;
	}

	#mo_project #s06 .box01 li a:hover {
		opacity: .5;
	}
}

@media screen and (max-width: 400px) {
	#mo_project #s06 {
		padding-block-end: 28.5vw;
	}

	#mo_project #s06 h1 {
		margin-block: -1vw 0;
	}

	#mo_project #s06 .box01 ul {
		border-radius: 2vw;
		margin-block-start: 2.25vw;
	}

	#mo_project #s06 .box01 li a {
		font-size: 5vw;
		padding-block: 4vw;
		padding-inline: 6vw 4.25vw;
	}

	#mo_project #s06 .box01 li a::after {
		width: 2.5vw;
		height: 2.5vw;
	}
}

/*----------------------------------------
	s07 ノベルティー情報
-----------------------------------------*/
#mo_project #s07 h1 {
	margin-block: -74px -51px;
}

#mo_project #s07 .box01 {
	background-color: var(--color-inverse);
	padding-block: 48px 32px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

#mo_project #s07 .box01 p {
	font-size: 1.8rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s07 .box01 ul {
	margin-block-start: 16px;
}

@media screen and (max-width: 400px) {
	#mo_project #s07 h1 {
		margin-block: -18.5vw -12.75vw;
	}

	#mo_project #s07 .box01 {
		padding-block: 12vw 8vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}

	#mo_project #s07 .box01 p {
		font-size: 4.5vw;
	}

	#mo_project #s07 .box01 ul {
		margin-block-start: 4vw;
	}
}

/*----------------------------------------
	s08 キャンペーン情報
-----------------------------------------*/
#mo_project #s08 h1 {
	margin-block: -64px -37px;
}

#mo_project #s08 .box01 {
	background-color: var(--color-secondary);
	padding-block: 48px 32px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

#mo_project #s08 .box01 p {
	font-size: 1.8rem;
	line-height: 1.66;
	text-align: center;
}

#mo_project #s08 .box01 ul {
	margin-block-start: 19px;
}

@media screen and (max-width: 400px) {
	#mo_project #s08 h1 {
		margin-block: -16vw -9.25vw;
	}

	#mo_project #s08 .box01 {
		padding-block: 12vw 8vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}

	#mo_project #s08 .box01 p {
		font-size: 4.5vw;
	}

	#mo_project #s08 .box01 ul {
		margin-block-start: 4.75vw;
	}
}

/*----------------------------------------
	s09 クリスマス関連情報
-----------------------------------------*/
#mo_project #s09 {
	position: relative;
	z-index: 1;
}

#mo_project #s09 h1 {
	margin-block: -64px -38px;
}

#mo_project #s09 .box01 {
	background-color: var(--color-secondary);
	padding-block: 48px 32px;
	border-bottom-right-radius: 16px;
	border-bottom-left-radius: 16px;
	overflow: hidden;
}

@media screen and (max-width: 400px) {
	#mo_project #s09 h1 {
		margin-block: -16vw -9.5vw;
	}

	#mo_project #s09 .box01 {
		padding-block: 12vw 8vw;
		border-bottom-right-radius: 4vw;
		border-bottom-left-radius: 4vw;
	}
}

/*----------------------------------------
	scroll effect
-----------------------------------------*/
#mo_project .accordion_wrap .accordion_box {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.5s;
}

#mo_project .accordion_wrap .accordion_box[aria-hidden="true"] {
	transition-delay: .5s;
}

#mo_project .accordion_wrap .accordion_box[aria-hidden="false"] {
	grid-template-rows: 1fr;
}

#mo_project .accordion_wrap .accordion_inner {
	overflow: hidden;
}

#mo_project .accordion_wrap .accordion_switch {
	cursor: pointer;
}

#mo_project .accordion_wrap .button.accordion_switch::before {
	content: "";
    position: absolute;
    top: 50%;
    right: 23px;
    display: block;
	transform: translateY(-50%);
	width: 2px;
	height: 16px;
	background-color: var(--color-inverse);
}

#mo_project .accordion_wrap .button.accordion_switch::after {
	right: 16px;
	transform: translateY(-50%);
	width: 16px;
	height: 2px;
	background-color: var(--color-inverse);
	border: unset;
}

#mo_project .accordion_wrap .button.accordion_switch[aria-expanded="true"]::before {
	opacity: 0;
}

@media screen and (max-width: 400px) {
	#mo_project .accordion_wrap .button.accordion_switch::before {
		right: 5.75vw;
		width: 0.5vw;
		height: 4vw;
	}

	#mo_project .accordion_wrap .button.accordion_switch::after {
		right: 4vw;
		width: 4vw;
		height: 0.5vw;
	}
}

/*----------------------------------------
	slider
-----------------------------------------*/
#mo_project .slider .slick-dots {
	display: flex;
	justify-content: center;
	gap: 12px;
	margin: 25px auto 0;
}

#mo_project .slider .slick-dots li {
	width: 10px;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	background-color: var(--color-ccc);
	cursor: pointer;
}

#mo_project .slider .slick-dots li.slick-active {
	background-color: var(--color-c10000);
}

#mo_project .slider .slick-dots button {
	visibility: hidden;
}

#mo_project .slider .slick-list .slick-slide {
	margin: 0 4px;
}

#mo_project .slider .slick-list .slick-slide img {
	width: 100%;
}

@media screen and (max-width: 400px) {
	#mo_project .slider .slick-dots {
		gap: 3vw;
		margin: 6.25vw auto 0;
	}

	#mo_project .slider .slick-dots li {
		width: 2.5vw;
	}

	#mo_project .slider .slick-list .slick-slide {
		margin: 0 1vw;
	}
}

/*----------------------------------------
	scroll effect
-----------------------------------------*/
/* scroll_up 下から上へ出現 */
.scroll_up {
	opacity: 0;
	transform: translateY(100px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98);
}

.scroll_up.active {
	opacity: 1.0;
	transform: translateY(0);
}

/* scroll_right 右から出現 */
.scroll_right {
	opacity: 0;
	transform: translateX(100px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98);
}

.scroll_right.active {
	opacity: 1.0;
	transform: translateX(0);
}

/* scroll_left 左から出現 */
.scroll_left {
	opacity: 0;
	transform: translateX(-100px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98);
}

.scroll_left.active {
	opacity: 1.0;
	transform: translateX(0);
}

/* scale_up */
.scale_up {
	opacity: 0;
	transform: scale(0.7) translateY(-10px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98);
}

.scale_up.active {
	opacity: 1.0;
	transform: scale(1) translateY(0);
}

/* scale_down */
.scale_down {
	opacity: 0;
	transform: scale(1.2) translateY(-10px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98);
}

.scale_down.active {
	opacity: 1.0;
	transform: scale(1) translateY(0);
}

.scale_down_delay {
	opacity: 0;
	transform: scale(1.2) translateY(-10px);
	transition: 1s cubic-bezier(0.33, 0.01, 0.02, 0.98) 0.8s;
}

.scale_down_delay.active {
	opacity: 1.0;
	transform: scale(1) translateY(0);
}