@charset "UTF-8";

.p-box{
	padding:20px 20px 30px;
	border-radius:20px;
	background-color:#fff;
}

.p-box__offset{
	max-width:820px;
	margin-inline:auto;

	& > :first-child{
		margin-top:0 !important;
	}

	& > :last-child{
		margin-bottom:0 !important;
	}
}

.p-heading{
	display:flex;
	flex-direction:column;
	justify-content:center;
	padding-bottom:15px;
	border-bottom:1px solid rgba(0, 0, 0, 0.2);
	margin-bottom:20px;

	> *{
		margin:0 auto;
	}

	&.of-boder-none{
		padding-bottom:0;
		border-bottom:none;
	}
}

.p-heading__title{
	color:#000;
	font-size:1.8rem;
	font-weight:700;
	line-height:1.6;
}

.p-text-value{
	color:var(--font-color);
	font-family:var(--font-en-roboto);
	font-size:5.8rem;
	font-weight:700;
	line-height:1;
	text-align:center;

	.l-main-structure.of-confectionary &{
		--font-color:#ff84a0;
	}

	.l-main-structure.of-cookery-2 &, .l-main-structure.of-cookery &{
		--font-color:#ff9a39;
	}
}

.p-text-value__unit{
	font-size:3.6rem;
}

.p-accordion, .p-accordion__inner{
	& > :first-child{
		margin-top:0 !important;
	}

	& > :last-child{
		margin-bottom:0 !important;
	}
}

.p-accordion{
	--title-color:#ffeef1;
	--border-color:#fadee5;
	--bg-color:#fff9fa;

	margin-top:15px;
	background-color:var(--bg-color);

	& + &{
		border-top:2px solid var(--border-color);
		margin-top:0;
	}

	.l-main-structure.of-confectionary &{
		--title-color:#ffeef1;
		--border-color:#fadee5;
		--bg-color:#fff9fa;
	}

	.l-main-structure.of-cookery-2 &, .l-main-structure.of-cookery &{
		--title-color:#ffecdb;
		--border-color:#f7dcc3;
		--bg-color:#fef6f3;
	}
}

.p-accordion__title{
	position:relative;
	display:flex;
	min-height:48px;
	align-items:center;
	padding:10px 48px 10px 20px;
	background-color:var(--title-color);
	font-weight:700;

	&::-webkit-details-marker{
		display:none;
	}

	&::before, &::after{
		position:absolute;
		top:0;
		bottom:0;
		display:block;
		margin:auto;
		background-color:#c41b1f;
		content:"";
		pointer-events:none;
	}

	&::before{
		right:20px;
		width:16px;
		height:2px;
	}

	&::after{
		right:27px;
		width:2px;
		height:16px;
	}

	.p-accordion[open] &{
		&::after{
			height:0;
		}
	}
}

.p-accordion__inner{
	padding:20px;
}

.p-list-job{
	display:flex;
	flex-wrap:wrap;
}

.p-list-job__item{
	&:not(:last-child){
		&::after{
			display:inline-block;
			width:1em;
			height:1em;
			background-color:currentcolor;
			clip-path:polygon(90% 0%, 100% 0%, 10% 100%, 0% 100%);
			content:"";
			transform:translateY(1px);
		}
	}
}

@media (width > 767px){
	.p-box{
		padding-block:30px 50px;
	}

	.p-box__offset{
		.c-layout-cardGrid.of-pc-col-2 .c-layout-cardGrid__cell:not(.of-full) &{
			max-width:328px;
		}
	}
	.p-heading__title{
		font-size:2.4rem;
	}
	.p-text-value{
		font-size:7.8rem;
	}

	.p-text-value__unit{
		font-size:4.8rem;
	}
	.p-list-job__item{
		&:not(:last-child){
			&::after{
				transform:translateY(2px);
			}
		}
	}
}
