@charset "Shift_JIS";

/* --------------------------------------------------------------
#contents
-------------------------------------------------------------- */
.txtBold{
	font-weight: bold;
}
.commconTbl .th-e {
	width: 35%;
	text-align: center;
}

body.gnavi03 #contents ul.list-step-procedure > li {
	position: relative;
	background: #eef7e6;
	border: 1px solid #e8e7d5;
	border-radius: 3px;
	padding: 3px 20px;
	margin-bottom: 50px;
}
body.gnavi03 #contents ul.list-step-procedure > li:last-of-type {
	margin-bottom: 20px;
}
body.gnavi03 #contents ul.list-step-procedure > li:last-of-type::after {
	display: none;
}
#main div.flame div.flame_top div.flame_btm ul.list-step-procedure > li h4 {
	background: none;
	padding-left: 5em;
	line-height: 1.2;
	position: relative;
}
#main div.flame div.flame_top div.flame_btm ul.list-step-procedure > li h4 span {
	background: none;
	padding: 0;
	display: inline-block;
	position: absolute;
	left: 0;
	top: 0;
}
ul.list-step-procedure > li .content::after {
	content: "";
	display: table;
	clear: both;
}
ul.list-step-procedure > li .content > .img {
	float: left;
	width: 90px;
}
ul.list-step-procedure > li .content > .txt {
	width: 500px;
	float: right;
}

.blank_icon {
	vertical-align: 3px;
}

#main div.flame div.flame_top div.flame_btm h4.step-hd span:first-child{
	display: flex;
	align-items: center;
	/*padding: 6px 20px;*/
}
#main div.flame div.flame_top div.flame_btm h4.step-hd span:first-child span{
	/*display: inline-block;*/
	background: none;
	padding: 0;
	line-height: 1.5;
}
#main div.flame div.flame_top div.flame_btm h4.step-hd span:first-child span:first-child{
	color: #01aa96;
	margin-right: 1em;
	min-width: 4em;
}

body.gnavi03 #contents div.step3{
	margin-bottom: 20px;
}
body.gnavi03 #contents div.step3 .use,
body.gnavi03 #contents div.step3 .txt{
	display: flex;
	justify-content: space-between;
}
body.gnavi03 #contents div.step3 .use p{
	flex-grow: 3;
}
body.gnavi03 #contents div.step3 .use p:last-child{
	flex-grow: 1;
}
body.gnavi03 #contents div.step3 .use p span{
	color: #fff;
	font-weight: bold;
	text-align: center;
	display: block;
	background: #01aa96;
	border-radius: 5px;
	margin: 0 2px;
}

body.gnavi03 #contents div.step3 .txt div{
	position: relative;
	margin: 20px 2px 0;
	padding: 10px;
	box-sizing: border-box;
	border: solid 1px #CCC;
	line-height: 1.6;
}
body.gnavi03 #contents div.step3 .txt div:first-child{
	width: 170px;
}
body.gnavi03 #contents div.step3 .txt div{
	width: 230px;
}

body.gnavi03 #contents div.step3 .txt div:last-child{
	width: 175px;
}


body.gnavi03 #contents div.step3 .txt p{
	margin-bottom: 0 !important;
}
body.gnavi03 #contents div.step3 .txt p::before {
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 15px 10px 0 10px;
	border-color: #01aa96 transparent transparent transparent;
	position: absolute;
	top: -25px;
	left: 50%;
	transform: translateX(-50%);
	display: inline-block;
}

body.gnavi03 #contents div.step-contents{
	display: flex;
	padding-left: 50px;
	background: url(../../images/14e/bg_step_arrow.png) left bottom no-repeat;
}
body.gnavi03 #contents div.step-contents div:nth-child(1){
	min-width: 96px;
}
body.gnavi03 #contents div.step-contents.arrow-none{
background: none;
}

div.multi-contract-table {
	display: flex;
	margin-left: 1em;
	justify-content: space-between;
}
div.multi-contract-table div {
	width: 226px;
}
div.multi-contract-table div p {
	text-align: center;
	font-weight: bold;
	white-space: nowrap;
}

.pc-only-inline {
	display: inline;
}

@media screen and (max-width: 600px){

	#main div.flame div.flame_top div.flame_btm h4.step-hd > span:first-child{
		display: block;
		line-height: 1.3;
}

body.gnavi03 #contents div.step-contents{
	flex-direction: column;
		line-height: 1.6;
}
body.gnavi03 #contents div.step-contents div:nth-child(1){
	min-width:initial;
	text-align: center;
}
body.gnavi03 #contents div.step-contents div:nth-child(1) img{
	margin-bottom: 1em;
}
body.gnavi03 #contents div.step-contents.arrow-none{
	padding-left: 0;
}
body.gnavi03 #contents div.step3 .txt div{
	width: 100% !important;
	text-align: left;
}

div.multi-contract-table {
	display: block;
}
div.multi-contract-table div {
	width: 100%;
	text-align: center;

}

.pc-only-inline {
	display: none;
}

}