@charset "UTF-8";

#mv h2     { background:none; width:940px; height:400px; }
#mv h2 img { width:100%; height:100%; }

/* select */
.select .bgNumber li { padding:20px; margin:0; }
.select .bgNumber h4 { padding-bottom:20px; border-bottom:2px solid #000; }
.select .bgNumber li::before { background-image:url(../../common/img/point.svg); }

/* cost */
.cost ul { list-style:none; padding:0; }
.cost li { position:relative; border:2px solid #000; padding:40px; margin:100px 0 0 0; width:530px; }
.cost li:nth-child(2) { padding-left:80px; margin-left:auto; }
.cost li::after {
	content:"";
	position:absolute; top:0; right:0; transform:translate(430px,40px);
	width:480px; height:280px;
	background:url(../../common/imgtop/img01.jpg)no-repeat;
}
.cost li:nth-child(2)::after {
	background-image:url(../../common/imgtop/img02.jpg);
	left:0; right:auto; transform:translate(-430px,40px);
}
.cost li:nth-child(3)::after { background-image:url(../../common/imgtop/img03.jpg); }
.cost h3, .cost p { text-align:left; margin:0 0 20px 0; }
.cost h3::after { left:0; transform:none; width:20%; }
.cost .btn { margin-top:40px; }

/* flow */
.flow { margin-top:120px; }
.flow h3         { text-align:left; margin-bottom:20px; }
.flow h3::after  { left:0; transform:none; }
.flow h4         { display:flex; align-items:center; writing-mode:vertical-rl; width:100%; }
.flow h4::before {
	content:""; position:static; top:auto; left:auto; transform:none;
	background:url(../../common/imgtop/flow01.svg)no-repeat;
	width:70px; height:70px; margin-bottom:30px;
}
.flow li:nth-child(2) h4::before { background-image:url(../../common/imgtop/flow02.svg); }
.flow li:nth-child(3) h4::before { background-image:url(../../common/imgtop/flow03.svg); }
.flow li:nth-child(4) h4::before { background-image:url(../../common/imgtop/flow04.svg); }
.flow li:nth-child(5) h4::before { background-image:url(../../common/imgtop/flow05.svg); }
.flow li:nth-child(6) h4::before { background-image:url(../../common/imgtop/flow06.svg); }
.flow .flexBox     { align-items:flex-start; margin-bottom:40px; }
.flow li { width:140px; margin:0; }
.flow li:not(:first-child)::after {
	content:""; position:absolute; top:50%; left:0; transform:translate(calc(-50% - 12px),-50%);
	width:60px; height:60px;
	background:#000 url(../../common/img/arrow.svg)no-repeat center center / 30px 15px;
	border:2px solid #FFF; border-radius:50%;
	font-weight:bold; text-align:center; box-sizing:border-box; z-index:1;
}


/*------------------------------------------------------------
	レスポンシブ
------------------------------------------------------------*/
@media (max-width: 768px){

}