@charset "utf-8";
/* CSS Document */

#concept {
	margin-bottom: 100px;
}
@media screen and (max-width: 768px) {
	#concept {
		margin-bottom: 60px;
	}
}
/* ==============================================

	concept_intro

================================================= */
#concept_intro {
	max-width: 1100px;
	margin: 0 auto 150px;
}
.concept_intro_ttl {
	text-align: center;
	margin-bottom: 50px;
}
.concept_intro_ttl h2 {
	font-size: 3rem;
	line-height: 166%;
	margin-bottom: 30px;
	font-weight: 500;
	color: #325d0d;
	letter-spacing: 0.15em;
}
.concept_intro_ttl h3 {
	font-size: 1.5rem;
	font-weight: 500;
	letter-spacing: 0.15em;
}
.concept_intro_box {
	background: #f5f7f4;
	padding: 60px 5%;
	text-align: center;
	line-height: 240%;
}
@media screen and (max-width: 768px) {
	.concept_intro_ttl h2 {
		font-size: 2.6rem;
	}
}

@media screen and (max-width: 640px) {
	
}

@media screen and (max-width: 480px) {
	#concept_intro {
		margin-bottom: 60px;
	}
	.concept_intro_ttl {
		margin-bottom: 35px;
	}
	.concept_intro_ttl h2 {
		font-size: 2.0rem;
		letter-spacing: 0.1em;
		margin-bottom: 20px;
	}
	.concept_intro_ttl h3 {
		font-size: 1.3rem;
		line-height: 180%;
		letter-spacing: 0.1em;
	}
	.concept_intro_box {
		padding: 40px 5%;
	}
}


/* ==============================================

	concept_rec_ttl

================================================= */
.concept_en {
	font-family: 'Cormorant Garamond', serif;
	font-size: 2.2rem;
}
.concept_rec_ttl {
	text-align: center;
	position: relative;
	padding-bottom: 20px;
	margin-bottom: 55px;
}
.concept_rec_ttl::after {
	content: "";
	display: block;
	border-top: 1px solid #325d0d;
	width: 60px;
	margin: 0 auto;
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
}

.concept_rec_ttl h2 {
	color: #325d0d;
	font-size: 2.8rem;
	line-height: 178%;
	font-weight: 500;
	letter-spacing: 0.15em;
	margin-bottom: 10px;
}
.concept_rec_ttl p {
	color: #727272;
	letter-spacing: 0.1em;
}
.concept_recArea {
	background: #f5f7f4;
	padding: 80px 5% 40px ;
}
.concept_recInner {
	max-width: 1300px;
	margin: 0 auto;
}
.concept_recSlide section {
	display: flex!important;
	align-items: flex-start;
	justify-content: space-between;
	gap: 100px 4%;
	padding-bottom: 100px;
}
.concept_recSlide section:nth-child(even) {
	flex-flow: row-reverse;
}
.concept_rec_img {
	position: relative;
	max-width: 800px;
	width: 61.5%;
}
.concept_rec_img p {
	position: absolute;
	bottom: -10%;
	font-family: 'Cormorant Garamond', serif;
	font-size: 12rem;
	color: rgba(155,141,86,0.3);
}
.concept_recSlide section:nth-child(odd) .concept_rec_img p {
	right: 30px;
}
.concept_recSlide section:nth-child(even) .concept_rec_img p {
	left: 30px;
}

.concept_rec_no {
	color: #c6bc9f;
	margin-bottom: 40px;
}
.concept_rec_no small {
	font-family: 'Cormorant Garamond', serif;
	font-size: 2rem;
}
.concept_rec_no p {
	font-family: "EB Garamond", serif;
	font-size: 12rem;
	line-height: 70%;
}
.concept_rec_txt h3 {
	font-size: 2.6rem;
	color: #325d0d;
	line-height:  177%;
	font-weight: 500;
	letter-spacing: 0.15em;
	margin-bottom: 60px;
	word-break: keep-all;
}
.concept_rec_txtBox p {
	line-height: 226%;
	word-break: keep-all;
}
.concept_recSlide .slick-arrow {
	filter: brightness(0) saturate(100%) invert(72%) sepia(10%) saturate(569%) hue-rotate(7deg) brightness(103%) contrast(93%);
}
.concept_recSlide .slick-arrow.prev {
	left: -80px;
}
.concept_recSlide .slick-arrow.next {
	right: -80px;
}

@media screen and (max-width: 1536px) {
	.concept_recArea {
		padding: 80px 10%;
	}
	.concept_recSlide .slick-arrow.prev {
		left: -7%;
	}
	.concept_recSlide .slick-arrow.next {
		right: -7%;
	}
	.concept_recSlide section {
		padding-bottom: 50px;
	}
}
@media screen and (max-width: 1366px) {
	.concept_rec_img p {
		position: relative;
		left: inherit!important;
		right: inherit!important;
		font-size: 10rem;
		bottom: -15%;
	}
	.concept_recSlide section:nth-child(even) .concept_rec_img p {
		text-align: right;
	}
	.concept_recSlide section {
		padding-bottom: 10px;
	}
}
@media screen and (max-width: 1024px) {
	.concept_recSlide section {
		flex-flow: column!important;
	}
	.concept_rec_img {
		width: 100%;
	}
	.concept_rec_img img {
		width: 100%;
		object-fit: cover;
		font-family: 'object-fit: none; object-position: right;';
		height: 300px;
	}
	.concept_rec_img p {
		position: absolute;
		right: 0!important;
		bottom: -18%;
	}
	.concept_rec_txt {
		width: 80%;
		margin: 0 auto;
		display: flex;
		justify-content: center;
		gap: 50px;
	}
	.concept_rec_txtBox {
		margin-top: 20px;
	}
	.concept_rec_txt h3 {
		margin-bottom: 30px;
	}
}
@media screen and (max-width: 768px) {
	.concept_rec_no small {
		font-size: 1.6rem;
	}
	.concept_rec_no p {
		font-size: 9rem;
	}
	.concept_rec_txt h3 {
		font-size: 2.3rem;
	}
	.concept_recSlide .slick-arrow.prev {
		left: -8%;
	}
	.concept_recSlide .slick-arrow.next {
		right: -8%;
	}
	.concept_rec_img p {
		font-size: 8rem;
	}
	.concept_rec_txt {
		gap: 30px;
	}
}
@media screen and (max-width: 640px) {
	.concept_recArea {
		padding: 30px 10% 80px;
	}
	.concept_rec_txt {
		flex-flow: column;
	}
	.concept_recSlide section {
		gap: 60px;
		padding-top: 60px;
	}
	.concept_rec_no {
		margin-bottom: 0;
		position: absolute;
		z-index: 1;
		top: 0;
	}
}
@media screen and (max-width: 480px) {
	.concept_recArea {
		padding: 30px 10% 40px;
	}
	.concept_rec_ttl {
		margin-bottom: 35px;
	}
	.concept_rec_ttl h2 {
		font-size: 2.0rem;
	}
	.concept_en {
		font-size: 2.0rem;
	}
	.concept_rec_img img {
		height: auto;
	}
	.concept_rec_img p {
		font-size: 5rem;
	}
	.concept_rec_txt {
		width: 90%;
	}
	.concept_rec_txt h3,
	.concept_rec_txtBox p {
		word-break: inherit;
	}
	.concept_rec_txt h3 {
		font-size: 1.9rem;
	}
	.concept_rec_txtBox {
		width: max-content;
		margin: 0 auto;
	}
	.concept_recSlide .slick-arrow.prev {
		left: -10%;
	}
	.concept_recSlide .slick-arrow.next {
		right: -10%;
	}
}



.concept_movie {
	text-align: center;
	margin-bottom: 120px;
	padding: 0 5%;
}
.concept_movieArea {
	max-width: 800px;
	margin: 0 auto;
}
.concept_movie iframe {
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
}
@media screen and (max-width: 480px) {
	.concept_movie {
		margin-bottom: 60px;
	}
}