section.panel {
	padding: 40px 5% 0px 5%;
	@media (width < 550px) {
		padding: 40px 0% 0px 0%;
	}
	> div {
		max-width: 1920px;
		margin-inline: auto;
		display: grid;
		> picture {
			padding-inline: 4%;
			grid-area: 1/1/2/2;
			@media (width < 550px) {
				padding-inline: 0%;
			}
			> img {
				width: 100%;
				max-width: 100%;
			}
		}
		> div {
			grid-area: 1/1/2/2;
			justify-self: start;
            align-self: center;
			@media (width < 550px) {
				padding-left: 2%;
			}
			> picture {
				> img {
					width: min(28vw,533px);
					@media (width < 550px) {
						width: 60vw;
					}
				}
			}
			> p {
				display: inline-block;
				padding-block: 2px 4px;
				padding-inline: 20px;
				margin-top: 10px;
				margin-right: 4%;
				text-align: center;
				background: linear-gradient(to right,#4065ff,#48edfc);
				font-size: min(1.1rem, 6vw);
				line-height: 1.5;
				color: #fff;
			}
		}
	}
}
section.breadcrumbs {
	padding-inline: 8.5vw;
	@media (width < 550px) {
		padding-inline: 5vw;
	}
}
section.sdgslogo {
	margin-top: 60px;
	background-color: #f1f1f1;
	padding: 60px 5% 60px 5%;
	> figure {
		text-align: center;
		> img {
			max-width: 100%;
		}
	}
}
section.fujico {
	background-color: #cee7ae;
	> div {
		display: grid;
		> figure {
			grid-area: 1/1/2/2;
			text-align: center;
			@media (width < 800px) {
				padding-top: calc(250px - 10vw);
			}
			> img {
				max-width: 100%;
			}
		}
		> div {
			grid-area: 1/1/2/2;
			padding-inline: 5%;
			> h3 {
				margin-top: 4%;
				text-align: center;
				font-size: min(1.8rem, 7vw);
				line-height: 1.5;
				color: #009145;
				font-weight: 700;
				letter-spacing: 1px;
			}
			> p {
				margin-top: min(2%, 30px);
				text-align: center;
				font-size: min(1.1rem, 5vw);
				line-height: 1.8;
				color: #000;
				font-weight: 600;
				letter-spacing: 2px;
				@media (width < 860px) {
					text-align: justify;
					> br {
						display: none;
					}
				}
			}
		}
	}
}
section.item {
	padding: 40px 5% 0 5%;
	> div {
		max-width: 1000px;
		margin-inline: auto;
		display: grid;
		grid-template-columns: 1.1fr 1fr;
		@media (width < 800px) {
			grid-template-columns: 1fr;
			row-gap: 40px;
		}
		> figure {
			text-align: center;
			> img {
				max-width: 100%;
			}
		}
		> div {
			align-content: center;
			@media (width < 800px) {
				justify-self: center;
			}
			> h4 {
				font-size: min(1.4rem, 6vw);
				line-height: 1.5;
				color: #000;
				font-weight: 700;
				letter-spacing: 1px;
			}
			> article {
				&:nth-of-type(1) {
					margin-top: 10px;
				}
				display: flex;
				align-items: center;
				column-gap: 20px;
				> h3 {
					font-size: min(2.4rem, 8vw);
					line-height: 1.3;
					color: #009145;
					font-weight: 700;
				}
				> p {
					font-size: min(1.2rem, 6vw);
					line-height: 1.0;
					color: #222;
				}
			}
		}
	}
}
section.vision {
	padding: 40px 5% 80px 5%;
	@media (width < 510px) {
		padding: 40px 7% 80px 7%;
	}
	> div {
		max-width: 1000px;
		margin-inline: auto;
		background-color: #f4f3ea;
		> div.top {
			padding-block: 30px;
			display: grid;
			align-items: center;
			> figure {
				padding-inline: 5%;
				grid-area: 1/1/2/2;
				text-align: center;
				> img {
					max-width: 100%;
				}
			}
			> h3 {
				text-align: center;
				grid-area: 1/1/2/2;
				font-size: min(1.8rem, 8vw);
				line-height: 1.5;
				color: #009145;
				font-weight: 700;
				letter-spacing: 3px;
			}
		}
		> article {
			> h4 {
				display: flex;
  				align-items: center;
				min-height: 45px;
				position: relative;
				padding-inline: 5%;
				background-color: #009145;
				font-size: min(1.4rem, 6vw);
				line-height: 1.5;
				color: #fff;
				font-weight: 700;
				letter-spacing: 2px;
				> img {
					position: absolute;
					top: 0;
					left: -20px;
					width: 20px;
				}
			}
			> p {
				padding-inline: 5%;
				font-size: min(1.0rem, 5vw);
				line-height: 1.8;
				color: #009145;
				&:nth-of-type(1) {
					padding-top: 10px;
				}
				&:nth-of-type(odd) {
					color: #009145;
				}
				&:nth-of-type(even) {
					color: #222;
					text-align: justify;
				}
				> sup {
					font-size: min(0.7rem, 3vw);
				}
			}
			> div {
				padding: 30px 5% 50px 5%;
				display: flex;
				column-gap: 10px;
				row-gap: 10px;
				flex-wrap: wrap;
				> figure {
					> img {
						max-width: 100%;
					}
				}
			}
		}
	}
}