@charset "utf-8";



/* page_title
-----------------------------------*/
#page_title h2{
	background-image: url("../img/bg_handover_01.png");
}
#page_title h2 img{
	left: 410px;
}



/* handover_unit
-----------------------------------*/
#handover_unit{
	width: 100%;
	margin-bottom: 180px;
}


#handover_unit > .intro{
	width: 1000px;
	margin-top: 106px;
	margin-inline: auto;
}
#handover_unit > .intro h3{
	text-align: center;
	margin-bottom: 40px;
}
#handover_unit > .intro p{
	font-size: 116%;
	line-height: 1.66;
	text-align: center;
}
#handover_unit > .intro p + p{
	margin-top: 25px;
}
#handover_unit > .intro .image{
	text-align: center;
}


#handover_unit > .interview{
	width: 100%;
	padding-block: 80px;
}
#handover_unit > .interview.odd{
	background: url("../../common/img/bg_01.gif") repeat center 0;
	padding-bottom: 70px;
}
#handover_unit > .interview h4{
	text-align: center;
	margin-bottom: 60px;
}
#handover_unit > .interview p.comment{
	font-size: 116%;
	line-height: 2.66;
}
#handover_unit > .interview p.name + p.comment{
	margin-top: 10px;
}


/* 写真を画面端まで裁ち落とすレイアウト（interview01＝写真左／interview03＝写真右） */
#handover_unit > .interview01 .inner,
#handover_unit > .interview03 .inner{
	display: flex;
	column-gap: 50px;
}
#handover_unit > .interview01 .image,
#handover_unit > .interview03 .image{
	width: 50%;
}
#handover_unit > .interview01 .image img,
#handover_unit > .interview03 .image img{
	width: 100%;
	height: 500px;
	object-fit: cover;
}
#handover_unit > .interview01 .text,
#handover_unit > .interview03 .text{
	max-width: 550px;
	flex: 1;
}


#handover_unit > .interview01{
	margin-top: 100px;
}
#handover_unit > .interview01 .text{
	margin-top: 30px;
	margin-right: 20px;
}


#handover_unit > .interview02 .inner{
	width: 1000px;
	margin-inline: auto;
}
#handover_unit > .interview02 p.name{
	width: 960px;
	margin-top: 30px;
	margin-inline: auto;
}
#handover_unit > .interview02 .columns{
	width: 960px;
	display: flex;
	column-gap: 80px;
	margin-top: 10px;
	margin-inline: auto;
}
#handover_unit > .interview02 .text{
	flex: 1;
}


#handover_unit > .interview03 .inner{
	justify-content: flex-end;
}
#handover_unit > .interview03 .text{
	margin-top: 80px;
	margin-left: 20px;
}


#handover_unit > .interview04{
	padding-bottom: 100px;
}
#handover_unit > .interview04 .inner{
	width: 1000px;
	display: flex;
	column-gap: 60px;
	margin-inline: auto;
}
#handover_unit > .interview04 .image{
	width: 390px;
}
#handover_unit > .interview04 .text{
	flex: 1;
}


#handover_unit > .message{
	width: 1000px;
	text-align: center;
	margin-inline: auto;
}
#handover_unit > .message p{
	margin-top: 60px;
}


#handover_unit > .shopping{
	width: 100%;
	margin-top: 200px;
}
#handover_unit > .shopping a{
	width: 100%;
	height: 520px;
	background: url("../img/bg_handover_02.jpg") no-repeat center center;
	background-size: cover;
	display: block;
	position: relative;
}
#handover_unit > .shopping a:after{
	content: "";
	width: 100%;
	height: 520px;
	background: #000000;
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	opacity: 0.3;
}
#handover_unit > .shopping h3, 
#handover_unit > .shopping p{
	position: absolute;
	left: 50%;
	z-index: 10;
}
#handover_unit > .shopping h3{
	margin-left: -297px;
	top: 111px;
}
#handover_unit > .shopping p{
	width: 204px;
	height: 44px;
	background: #e63900;
	border: 3px solid #e63900;
	box-shadow: 0 0 0 1px #ffffff inset;
	border-radius: 25px;
	margin-left: -105px;
	top: 414px;
}
#handover_unit > .shopping p:after{
	content: "";
	width: 8px;
	height: 14px;
	background: url("../../common/img/ico_arrow_02.png") no-repeat 0 0;
	display: inline-block;
	position: absolute;
	left: 45px;
	top: 15px;
}
#handover_unit > .shopping p img{
	position: absolute;
	left: 61px;
	top: 12px;
}
#handover_unit > .shopping a:after, 
#handover_unit > .shopping p, 
#handover_unit > .shopping p:after{
	-webkit-transition: all 0.2s ease;
	transition: all 0.2s ease;
}
#handover_unit > .shopping a:hover:after{
	opacity: 0;
}
#handover_unit > .shopping a:hover p{
	background: #e58600;
	border-color: #e58600;
}
#handover_unit > .shopping a:hover p:after{
	left: 47px;
}