@charset "utf-8";
/*////////////////////////////////////
concept
////////////////////////////////////*/
@media screen and (min-width: 768px){
#concept_main {
	position: relative;
	width: 100%;
	background: #FEFEFE;
}

#concept_image_area {
	position: relative;
	width: 100%;
	aspect-ratio:16/7;
}

#concept_image_area_sp {
	display: none;
}

#concept_main_title_area {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#concept_main_title {
	position: relative;
	margin-bottom: 10px;
	text-align: center;
	width: 100%;
}
#concept_main_title h2 {
	font-family: "Noto Serif JP", serif;
	font-size: clamp(2rem,2.6vw,3.6rem);
	font-weight: 400;
	letter-spacing: 0.1em;
	color: #FFF;
}
#concept_main_title_word {
	position: relative;
	width: 100%;
	font-family: "Noto Serif JP", serif;
	font-size: clamp(1.4rem,1.2vw,1.8rem);
	letter-spacing: 0.1em;
	color: #FFF;
	font-weight: 400;
	text-align: center;
}
}

@media screen and (min-width: 0px) and (max-width: 767px){
#concept_main {
	position: relative;
	width: 100%;
	background: #FEFEFE;
}

#concept_image_area {
	display: none;
}
#concept_image_area_sp {
	position: relative;
	width: 100%;
	margin-bottom: 50px;
}

#concept_main_title_area {
	position: absolute;
	width: 100%;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
#concept_main_title {
	position: relative;
	width: 100%;
	margin-bottom: 10px;
	text-align: center;
}
#concept_main_title h2 {
	font-family: "Noto Serif JP", serif;
	font-size: clamp(2rem,2.6vw,3.6rem);
	font-weight: 400;
	letter-spacing: 0.1em;
	color: #FFF;
}
#concept_main_title_word {
	position: relative;
	width: 100%;
	font-family: "Noto Serif JP", serif;
	font-size: clamp(1.4rem,1.2vw,1.8rem);
	color: #FFF;
	font-weight: 400;
	text-align: center;
	letter-spacing: 0.1em;
}
}


/*////////////////////////////////////
concept
////////////////////////////////////*/
@media screen and (min-width: 768px){
.concept {
	position: relative;
	width: 100%;
	padding: 100px 0;
}
.concept_area {
	position: relative;
	width: 90%;
	margin: 0 auto;
	max-width: 1200px;
}
.concept_title {
	position: relative;
	text-align: center;
	margin-bottom: 100px;
}
.concept_title h3 {
	font-family: "Noto Serif JP", serif;
	font-size: 2.6rem;
	font-weight: 400;
}
.concept_place {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	flex-direction:row-reverse;
	flex-wrap: wrap;
}
.concept_item {
	position: relative;
	width: 23%;
	margin: 0 1%;
	display: flex;
	justify-content: flex-start;
	flex-direction:row-reverse;
}
.concept_item_title {
	position: relative;
	display: inline-block;
	writing-mode:vertical-rl;
	margin: 0 auto 0 1em;
	font-family: "Noto Serif JP", serif;
	font-size: 2rem;
	font-weight: 600;
}
.concept_item_word {
	position: relative;
	display: inline-block;
	writing-mode:vertical-rl;
	margin: 0 0 0 auto;
	font-family: "Noto Serif JP", serif;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 2;
}
}
@media screen and (min-width: 0px) and (max-width: 767px){
.concept {
	position: relative;
	width: 100%;
	padding: 100px 0;
}
.concept_area {
	position: relative;
	width: 90%;
	margin: 0 auto;
	max-width: 1200px;
}
.concept_title {
	position: relative;
	text-align: center;
	margin-bottom: 50px;
}
.concept_title h3 {
	font-family: "Noto Serif JP", serif;
	font-size: 2.6rem;
	font-weight: 400;
}
.concept_place {
	position: relative;
	width: 100%;
	display: flex;
	justify-content: flex-end;
	flex-direction:row-reverse;
	flex-wrap: wrap;
}
.concept_item {
	position: relative;
	width: 100%;
	margin: 0 auto 50px;
	display: flex;
	justify-content: flex-start;
	flex-direction:row-reverse;
}
.concept_item_title {
	position: relative;
	display: inline-block;
	writing-mode:vertical-rl;
	margin: 0 auto 0 1em;
	font-family: "Noto Serif JP", serif;
	font-size: 2rem;
	font-weight: 400;
}
.concept_item_word {
	position: relative;
	display: inline-block;
	writing-mode:vertical-rl;
	margin: 0 0 0 auto;
	font-family: "Noto Serif JP", serif;
	font-size: 1.6rem;
	font-weight: 400;
	line-height: 2;
}
}


/*////////////////////////////////////
concept
////////////////////////////////////*/
@media screen and (min-width: 768px){
.concept_otherarea {
	position: relative;
	width: 90%;
	margin: 0 auto;
	max-width: 1000px;
}
.concept_other_place {
	position: relative;
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	margin-bottom: 50px;
}
.concept_other_image {
	position: relative;
	width: 40%;
	margin-right: 10%;
}
.concept_other_word_area {
	position: relative;
	width: 50%;
}
.concept_other_word_area h4 {
	font-size: 2rem;
	font-family: "Noto Serif JP", serif;
	font-weight: 400;
	margin-bottom: 1em;
	
}
.concept_other_word_area p {
	font-size: 1.6rem;
	line-height: 2;
	font-family: "Noto Serif JP", serif;
	font-weight: 400;
}
.concept_other_banner {
	position: relative;
	width: 40%;
	margin: 0 5%;
}
.concept_other_banner a {
	transition: all 0.3s;
}
.concept_other_banner a:hover {
	opacity: 0.8;
}
}

@media screen and (min-width: 0px) and (max-width: 767px){
.concept_otherarea {
	position: relative;
	width: 90%;
	margin: 0 auto;
	max-width: 1000px;
}
.concept_other_place {
	position: relative;
	margin-bottom: 50px;
}
.concept_other_image {
	position: relative;
	width: 100%;
	margin-bottom: 10px;
}
.concept_other_word_area {
	position: relative;
	width: 100%;
}
.concept_other_word_area h4 {
	font-size: 2rem;
	font-family: "Noto Serif JP", serif;
	font-weight: 400;
	margin-bottom: 1em;
	
}
.concept_other_word_area p {
	font-size: 1.6rem;
	line-height: 2;
	font-family: "Noto Serif JP", serif;
	font-weight: 400;
}
.concept_other_banner {
	position: relative;
	width: 100%;
	margin-bottom: 20px;
}
.concept_other_banner a {
	transition: all 0.3s;
}
.concept_other_banner a:hover {
	opacity: 0.8;
}
}