.subf_view_inner {
	background:url(../images/woman/bg_woman.jpg) no-repeat center / cover;
}

.h_title::after {
	background:#D9B3C1;
}

/* --- concept --- */

.concept {
	position: relative;
	margin-bottom:125px;
}

.concept_intro{
	width:100%;
	display:inline-block;
	margin-bottom:140px;
}

.concept_intro .h_title{
	color:#000;
	font-size:45px;
	padding-bottom:25px;
}

.concept_intro .concept_intro_txt{
	text-align:center;
}

.concept_area{
	width:100%;
	height:640px;
	background:#f5f1f3;
	display:inline-block;
	float:left;
}

.concept_area .img_left_box_inner,
.concept_area .img_right_box_inner{
	width:50%;
	height:100%;
	display:inline-block;
	float:left;
}

.concept_area .img_left_box_inner img,
.concept_area .img_right_box_inner img{
	width:100%;
	height:100%;
	object-fit:cover;
}

.concept_area .txt_right_box_inner,
.concept_area .txt_left_box_inner{
	width:50%;
	height:100%;
	display:inline-block;
	float:left;
}

.concept_txt_area{
	width:600px;
	display:inline-block;
}

.concept_txt_right{
	padding:110px 0 0 80px;
	float:left;
}

.concept_txt_left{
	padding:110px 80px 0 0;
	float:right;
}

.concept_txt_area .concept_tit_area{
	width:100%;
	display:inline-block;
	margin-bottom:30px;
}

.concept_txt_area .concept_tit_area .concept_tit_rubi{
	color:#9d927f;
	font-size:16px;
}

.concept_txt_area .concept_tit_area .concept_tit{
	font-size:2.5rem;
	line-height:1.5em;
}

.concept_txt_area .concept_txt{
	margin-bottom:40px;
}

.concept_txt_area .concept_btn{
	width:200px;
	/*アニメーションの起点とするためrelativeを指定*/
    position: relative;
	overflow: hidden;
    /*ボタンの形状*/
	text-decoration: none;
	display: block;
   	border: 1px solid #9d927f;/* ボーダーの色と太さ */
    padding: 20px 30px;
    text-align: center;
    outline: none;
    /*アニメーションの指定*/   
    transition: ease .2s;
}

/*ボタン内spanの形状*/
.concept_txt_area .concept_btn span {
	position: relative;
	z-index: 3;/*z-indexの数値をあげて文字を背景よりも手前に表示*/
	color:#9d927f;
}

.concept_txt_area .concept_btn:hover span{
	color:#fff;
}

/*== 背景が流れる（上から下） */
.bgchange:before {
 	content: '';
    /*絶対配置で位置を指定*/
 	position: absolute;
 	top:0;
 	left: 0;
 	z-index: 2;
    /*色や形状*/
 	background:  #9d927f;/*背景色*/
 	width: 100%;
	height: 0;
    /*アニメーション*/
 	transition:.3s cubic-bezier(0.8, 0, 0.2, 1) 0s;
}

/*hoverした際の形状*/
.bgchange:hover:before{
	 height: 100%;	
 	 background-color: #9d927f;
}



@media screen and (max-width:1280px){
	.concept_intro{
		width:90%;
		margin:0 5% 80px 5%;
	}
	
	.concept_area{
		height:680px;
	}

	.concept_txt_right{
		width:90%;
		padding:10% 0 0 10%;
	}
	
	.concept_txt_left{
		width:90%;
		padding:10% 10% 0 0;
	}
	
}

/* ---------  ver.SmartPhone ------------ */

@media screen and (max-width:768px){
	.concept{
		margin-bottom:0;
	}
	
	.concept_intro{
		margin:0 5% 60px 5%;
	}
	
	.concept_intro .h_title{
		font-size:30px;
	}

	.concept_area{
		height:auto;
		background:linear-gradient(180deg,#ffffff 0%,#ffffff 10%,#f5f1f3 10%,#f5f1f3 100%);
		margin-bottom:60px;
		padding-bottom:60px;
		display: -webkit-box;
    	display: -webkit-flex;
    	display: -ms-flexbox;
    	display: flex;
    	flex-direction: column;
    	position: relative;
	}
	
	.concept_area .img_left_box_inner,
	.concept_area .img_right_box_inner{
		width:90%;
		margin:0 5% 20px 5%;
	}
	
	.concept_area .txt_right_box_inner,
	.concept_area .txt_left_box_inner{
		width:90%;
		margin:0 5%;
	}
	
	.concept_area .img_right_box_inner{
		order:1;
	}
	
	.concept_area .txt_left_box_inner{
		order:2;
	}
	
	.concept_txt_left,
	.concept_txt_right{
		width:100%;
		padding:0;
	}
	
	.concept_txt_area .concept_tit_area{
		margin-bottom:20px;
	}
	
	.concept_txt_area .concept_tit_area .concept_tit{
		font-size:2.3rem;
	}
	
	.concept_txt_area .concept_btn{
		margin:0 auto;
	}

}