@charset "utf-8";

.l-extra {
	height: 60vh;
}
.l-extra-image.default {
	background-image: url("../../img/2-9.jpg");
	background-image: image-set(url("../../img/2-9.jpg") 1x, url("../../img/2-9.jpg") 2x);
	background-image: -webkit-image-set(url("../../img/2-9.jpg") 1x, url("../../img/2-9.jpg") 2x);
}

.img_1-7 {
	background-image: url("../../img/1-7.jpg");
	background-image: image-set(url("../../img/1-7.jpg") 1x, url("../../img/1-7.jpg") 2x);
	background-image: -webkit-image-set(url("../../img/1-7.jpg") 1x, url("../../img/1-7.jpg") 2x);
}

.img_1-1 {
	background-image: url("../../img/1-1.jpg");
	background-image: image-set(url("../../img/1-1.jpg") 1x, url("../../img/1-1.jpg") 2x);
	background-image: -webkit-image-set(url("../../img/1-1.jpg") 1x, url("../../img/1-1.jpg") 2x);
}
.img_1-1::before {
/*	padding-top: calc(((800 / 1200) * 100%));	*/
	aspect-ratio: 1200 / 800;
}

.img_1-2 {
	background-image: url("../../img/1-2.jpg");
	background-image: image-set(url("../../img/1-2.jpg") 1x, url("../../img/1-2.jpg") 2x);
	background-image: -webkit-image-set(url("../../img/1-2.jpg") 1x, url("../../img/1-2.jpg") 2x);
}
.img_1-2::before {
/*	padding-top: calc(((800 / 1200) * 100%));	*/
	aspect-ratio: 1200 / 800;
}

.img_1-3 {
	background-image: url("../../img/1-3.jpg");
	background-image: image-set(url("../../img/1-3.jpg") 1x, url("../../img/1-3.jpg") 2x);
	background-image: -webkit-image-set(url("../../img/1-3.jpg") 1x, url("../../img/1-3.jpg") 2x);
}
.img_1-3::before {
/*	padding-top: calc(((800 / 1200) * 100%));	*/
	aspect-ratio: 1200 / 800;
}

.l-main h1 {
	margin-top: 2rem;
}
.content h2 {
	margin: 0 0 1.5em;
	font-size: 6.5vw;
	font-weight: 700;
	line-height: 1.8;
	letter-spacing: 0.1em;
}
.content h3 {
	margin: 5em 0 1em;
	font-size: 22px;
	font-feature-settings: "palt";
	letter-spacing: 0.05em;
}
.content h4 {
	margin: 5em 0 1.5em;
	font-size: 18px;
	font-feature-settings: "palt";
	letter-spacing: 0.1em;
	line-height: 1.6;
}
.content p {
	font-size: 15px;
	font-feature-settings: "palt";
	letter-spacing: 0.1em;
	line-height: 2;
}
.content .lead {
	font-size: 17px;
	letter-spacing: 0.1em;
}
.content .spec {
	letter-spacing: 0.05em;
}
.content p + p {
	margin-top: 1em;
}
.content p + .image {
	margin-top: 4em;
}


@media screen and (min-width: 768px) {

	.l-extra {
		height: 100vh;
	}

	.content h2 {
		font-size: 30px;
	}



}
