@charset 'utf-8';

/*メディアクエリー
スマホ @media (max-width: 768px)
タブレットのみ @media (min-width:768px) and (max-width:1000px)
タブレット・PC @media (min-width:768px)
PCのみ　@media (max-width: 1000px)
PC大 @media (min-width:1200px) 
※上記以外のブレイクポイントは、例外的に設定。その場合はコメントアウトを記載すること。
*/

.box_contents.top {margin-top:64px; padding-bottom:0; }
.box_contents .inner.top { padding-top:40px; }
.box_contents .inner { padding-top:80px; padding-bottom:0; }
.box_contents { padding-bottom:80px; }
.title_wrap .title h1 { font-size:24px; line-height:1.68em; text-align:left; margin-bottom:24px; letter-spacing:0.04em; }
.title_wrap .title p { margin-bottom:24px; }
.title_wrap img { width:100%; }
@media screen and ( min-width: 768px ) {
    .box_contents.top { margin: 87px auto 0 auto; background:#fff; padding-bottom:120px; }
	.box_contents .inner { padding-top:120px; }
	.box_contents .inner.top { padding-top:120px; }
	.box_contents .inner.top .title_wrap { margin-bottom:0; }
	.box_contents { padding-bottom:0; }
	.title_wrap { margin-bottom:120px; }
	.title_wrap .title { width:49%; }
	.title_wrap .title h1 { width:100%; font-size:48px; letter-spacing:0.1em; }	
	.title_wrap .title p { width:100%; }
	.title_wrap img { width:49%; float:right; }
}

.flow { display:flex; flex-wrap:wrap; background:#fff; border-radius:20px; padding:0 30px 30px 30px; }
.flow_title { width:100%; text-align:center; margin-top:-16px; }
.flow_title li { margin-bottom:24px; }
.flow_title li h2 { width:100%; font-size:20px;  text-align:center; display:inline-block; font-family:'GenJyuuGothic-Bold'; letter-spacing:0.04em; }
.flow_title li .roboto { width:120px; height:32px; display:flex; align-items:center; justify-content:center; background:#fcff56; border-radius:16px; margin:0 auto 24px; line-height:normal; letter-spacing:0.05em;}
.flow p { width:100%; display:block; margin-bottom:24px; text-align:justify;}
.flow_illust { width:100%; margin:0 auto; display:block; text-align:center;  }
.flow_illust img { width:100%; }
@media screen and ( min-width: 768px ) {
	.flow { padding:50px 70px; display:flex; align-items:center; justify-content:space-between; align-items:center;}
	.flow_title { width:67%; text-align:left; display:flex; flex-wrap:wrap;  margin-top:0; margin-bottom:0; align-items:center;}
	.flow_title li .roboto { margin-right:20px; margin-bottom:0; }
	.flow_title li h2 { font-size:24px; width:auto; line-height:32px; letter-spacing:0.1em; }
	.flow_title li.long { width:100%; margin-top:30px; }
	.flow_title li { margin-bottom:0; }
	.flow_illust { width:30%; height:190px; margin:initial; display:initial; text-align:initial; }
	.flow_illust img  {height: 100%;  width:100%; object-fit: contain;  }
	.flow p { width:100%; margin-bottom:0; }

}

@media screen and ( max-width:374px ) {
	.box_contents .link img { margin-left:18vw; }
}

.arrow_wrap { width:100%; height:58px; margin-bottom:10px;  display:flex; align-items:center; text-align:center; justify-content: center;}
.arrow_wrap img { width:18px; height:10px;  }
.link_wrap.flow { width:90%; text-align:center; margin:80px auto 0 auto; display:block; background:none; padding:0; }
.link_wrap.flow .button_search { width:100%; }
.link_wrap.flow .link { width:100%; margin-bottom:40px; float:none; }
.box_contents .link { justify-content:initial;}
.box_contents .link img { margin-left:27vw; }
.box_contents .link img.arrow_flow { margin-left:21vw; }
@media screen and ( min-width: 768px ) {
	.arrow_wrap { height:100px; margin-bottom:0; }
	.arrow_wrap img { width:36px; height:22px; }
	.link_wrap.flow { width:300px; margin-top:80px; margin-bottom:120px; }
	.box_contact { margin-top:0; }
	.link_wrap.flow .button_search { width:300px; margin-bottom:30px; }
	.link_wrap.flow .link { width:300px; }
	.box_contents .link img { margin-left:80px; }
	.box_contents .link img.arrow_flow { margin-left:60px; }
}

.flow_detail { display:flex; flex-wrap:wrap; justify-content:space-between;}
.flow_detail li { width:100%; }
.flow_detail .border { border-bottom:1px solid #BBBBBB; margin-bottom:20px; }
.flow_detail li.long { width:100%; }
.flow_detail li dl { display:flex; color:#5C9062; margin-bottom:16px;}
.flow_detail li dl dt { width:auto; margin-right:10px; font-size:18px; display:flex; align-items:center;}
.flow_detail li dl dd h3 { font-size:18px; line-height:24px; letter-spacing:0.04em; }
.flow_detail li dl dd {display: flex;align-items: center; }
@media screen and ( min-width: 768px ) {
	.flow_detail { gap:30px; margin-top:40px; }	
	.flow_detail li dl { height:24px; margin-bottom:10px; }
	.flow_detail li { width:45%; }
	.flow_detail .border { border-bottom:0; margin-bottom:initial; }
}

/*フッターのリンク*/
@media screen and ( min-width: 768px ) {
    .footer_link { display:block; }
}