@charset "utf-8";





.practice_common .box{
	position: relative;
	padding-top: 4em;
}

.practice_common .box.bg_lgren {
	background: #fff;
	border: solid 3px var(--c_lgren);
}

.practice_common h2{
	width: 80%;
	max-width: 600px;
	border-radius: 6em;
	padding: .25em .75em;
	font-size: clamp(1.375rem, 0.966rem + 2.05vw, 2.5rem);
	color: #fff;
	text-align: center;
	margin: auto;
  position: absolute;
  top: -.25em;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  margin: auto;
}
.practice_common h2::after {
	content: "";
	display: block;
	width: .65em;
	height: .5em;
	clip-path: polygon(0% 0%, 100% 0%, 50% 100%);
	position: absolute;
	bottom: -.45em;
	left: 50%;
	transform: translateX(-50%);
	margin: auto;
}

.sec_confectionary h2,
.sec_confectionary h2::after{
	background-color: var(--c_red);
}

.sec_nutrition h2,
.sec_nutrition h2::after{
	background-color: var(--c_gren);
}

.sec_cooking h2,
.sec_cooking h2::after{
	background-color: var(--c_org);
}

.practice_common .list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2em;
}

.practice_common .list li{
	background: #fff;
	border-radius: var(--br10);
}


.practice_common .list .img_area img{
	border-radius: var(--br10) var(--br10) 0 0;
}
.practice_common .list .txt_area{
	padding: 1em 1.5em 1.25em;
}


.practice_common .list h3{
	margin-bottom: .5em;
}

.sec_confectionary .list h3{color: var(--c_red);}
.sec_nutrition .list h3{color: var(--c_gren);}
.sec_cooking .list h3{color: var(--c_org);}



@media (max-width: 799px){

.practice_common .list{
	grid-template-columns: repeat(2, 1fr);
	gap: 1.5em;
}




}


@media (max-width: 599px){

.practice_common .box{
	padding-top: 3em;
}
.practice_common .list{
	grid-template-columns: repeat(1, 1fr);
}

.practice_common h2{
	width: 96%;
	padding: .25em;
}



}