
/*quiz*/
.quiz {
    background-color: #F8D5DC;
}
.quiz .container article .areticle-header > div h3 span{
	color: #46B136;
}
.quiz .container article .areticle-header > div .btn-area > a{
	background-color: #46B136;
}
.quiz .container article .example > dl > dt b{
	color: #46B136;
}
.quiz .container article .example > dl > dd{
	background-color: #46B136;
}

/*instagram*/
.instagram {
    background-color: #E3EEDF;
}
.instagram .instagram-list > ul > li:nth-of-type(2) h3::before {
    background: url(../images/life/img_instagram_ic01_202508.svg);
}
.instagram .instagram-list > ul > li:nth-of-type(6) h3::before {
    background: url(../images/life/img_instagram_ic03_202508.svg);
}
.instagram .instagram-list > ul > li:nth-of-type(7) h3::before {
    background: url(../images/life/img_instagram_ic03_202508.svg);
}
.instagram .instagram-list > ul > li:nth-of-type(8) h3::before {
    background: url(../images/life/img_instagram_ic03_202508.svg);
}
.instagram .instagram-list .list-content > span{
	color: #0C853D;
}

/*trend1*/
.trend1 .page-header .details {
    background-color: #D3DE7A;
}
.trend1 section article.epi strong {
	color: #000;
}

/*trend2*/
.trend2 .page-header .details {
    background-color: #000;
}
.trend2 .page-header .details * {
    color: #fff !important;
}
.trend2 section:nth-of-type(1) {
	background: none;
}
.trend2 section:nth-of-type(1)::after{
	background: none;
}
.trend2 article{
	margin-bottom: 100px;
}
.trend2 section article p {
    margin-top: 20px;
}
.trend2 .flex {
	display: table;
	width: calc(100% + 30px); 
	table-layout: fixed;
	margin: 0 -15px 60px;
}
.trend2 .flex > figure {
	display: table-cell; 
	vertical-align: top;
	padding: 0 15px;
}
.trend2 .trend2-product{
	 flex-basis: 150%;
	 padding-top: 30px;
}
.trend2 .trend2-epi {
	padding: 60px 0;
}
.trend2 .trend2-epi *{
	color: #fff;
}
.trend2 .trend2-epi .flex{
	margin-top: 60px;
}
.trend2 .trend2-epi .flex div{
 	width: 50%;
	display: table-cell; 
	vertical-align: top;
	padding: 0 15px;
}
.trend2 .trend2-epi .flex h4{
	margin: 20px 0 10px 0;
}
.trend2 .trend2-epi .flex p{
	margin: 0;
}

.table {
	display: table;
	width: calc(100% + 30px); 
	table-layout: fixed;
	margin: 0 -15px 60px;
}
.table > div {
	display: table-cell;
	vertical-align: top;
	padding: 0 15px;
}
.table > div:last-child {
	width: 35%;
}
@media (max-width: 1024px) {
	.trend2 .flex{
		display: block;
		width: 100%;
		margin: 0;
		margin-bottom: 30px;
	}
	.trend2 .flex > div {
		display: block !important; width: 100% !important; padding: 0 !important;
	}
	.trend2 .flex > div ~ div {
		margin-top: 30px !important;
	}
	.trend2 .flex figure{
		display: block !important;
		width: 100% !important;
		padding: 0 !important;
	}
	.trend2 .flex figure ~ figure {
		margin-top: 30px !important;
	}
	.trend2 article{
		margin-bottom: 30px;
	}
	.trend2 article:last-child{
		margin: 0;
	}
	.trend2 .trend2-epi{
		padding: 40px 15px;
	}
	.trend2 .trend2-epi .flex{
		margin-top: 40px;
		padding: 0;
	}
	.trend2 .trend2-epi .flex div{
		width: 100%;
	}
	.table {
		display: block;
		width: 100%;
		margin: 0;
		padding-bottom: 30px;
	}
	.table > div {
		display: block;
		width: 100% !important;
		padding: 0;
	}
	.table > div ~ div {
		margin-top: 30px;
	}
}