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

/*==========================
mv
==========================*/
#mv .container{ position: relative;}
#mv_txt p{
	line-height: 2.3rem;
	margin-bottom: 0;
}
@media(min-width:768px){
	#mv_txt{
		position: absolute;
		top: 60%;
		left: 50%;
		transform: translateY(-60%) translateX(-50%);
		-webkit-transform: translateY(-60%) translateX(-50%);
		width: 100%;
		max-width: 560px;
	}
	#mv_txt h1{
		font-size: 1.8rem;
		margin-bottom: 30px;
	}
	#mv_txt p{ text-align: center;}

}
@media(max-width:767px){
	#mv img{ display: none;}
	#mv_txt{
		background-image: url("../images/concept/mv.jpg");
		background-size: cover;
		background-position: top center;
		
	}
	#mv_txt h1{
		font-size: 1.4rem;
		line-height: 2.3rem;
		text-align: center;
		margin-bottom: 15px;
	}
}
@media(min-width:576px) and (max-width:767px){
	#mv_txt{ padding: 25% 15px 30px;}
}
@media(max-width:575px){
	#mv_txt{ padding: 50% 15px 30px;}
}


/*==========================
concept
==========================*/
.conceptbox{
	display: flex;
	flex-wrap: wrap;
}
.concept_txt h2{
	margin-bottom: 15px;
	width: 100%;
}
.concept_txt p{
	line-height: 2.3rem;
	margin-bottom: 0;
}
.conceptbox_full .concept_txt{ margin-bottom: 30px;}

@media(min-width:992px){
	.conceptbox .concept_txt{
		width: 350px;
		padding: 0 25px;
		position: relative;
	}
	.conceptbox .c_txt_inner{
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		text-align: left;
	}
	.conceptbox .c_txt_inner img{
		margin-top: 15px;
		margin-bottom: 15px;
	}
	.conceptbox div:first-child .c_txt_inner img{ right: -40px;}
	.conceptbox div:last-child .c_txt_inner img{ left: -40px;}
}
@media(min-width:768px) and (max-width:991px){
	.conceptbox .c_txt_inner img{
		margin-top: 30px;
		margin-bottom: 30px;
	}
}
@media(min-width:768px){
	.conceptbox .c_txt_inner img{
		position: relative;
		width: 100%;
	}
	.conceptbox .concept_photo{ flex: 1;}
	.conceptbox_full{
		text-align: center;
		padding: 30px 0 60px;
	}
}
@media(min-width:768px) and (max-width:991px){
	.conceptbox .concept_txt{
		width: 325px;
		padding: 30px 20px 0;
	}
	.conceptbox .c_txt_inner{
		display: flex;
		flex-wrap: wrap;
	}
	.conceptbox div:first-child .c_txt_inner img{ right: -30px;}
	.conceptbox div:last-child .c_txt_inner img{ left: -30px;}
	.conceptbox .c_txt_inner h2{ order: 1;}
	.conceptbox .c_txt_inner p{ order: 2;}
	.conceptbox .c_txt_inner img{ order: 3;}
}

@media(max-width:767px){
	.conceptbox{ 
		margin-top: 30px;
		position: relative;
	}
	.concept_txt{ order: 1;}
	.c_txt_inner img{
		position: absolute;
		bottom: -40px;
		right: -40px;
		width: 150px;
		height: auto;
	}
	.concept_photo{
		order: 2;
		margin-top: 15px;
		width: 100%;
	}
	.conceptbox_full{ padding: 30px 0 0;}
	.conceptbox_full .concept_txt,
	.conceptbox .concept_txt#design{ margin-top: 40px;}
}
