@charset "UTF-8";

.step_block{
	
}
@media only screen and (max-width: 736px) {
}

.txt_big{
	font-size: 130%;
}

/*ご登録から手数料お支払いまでのステップ*/
/*.step_block .step_ttl{
	font-size: 120%;
	margin-bottom: 10px;
	letter-spacing: 0.1em;
}
.step_block .step_ttl span{
	background-color: #000;
	border-radius: 99em;
	padding: .5% 4% .5% 2%;
	margin: 0 0 10px 10px;
	color: #fff;
	font-weight: 400;
	letter-spacing: normal;
}
.step_block .step_ttl span.period{
	border: 1px solid #fff;
	padding: 0 2%;
	border-radius: 0;
	font-size: 80%;
}
.step_block .step_contents{
	margin: 30px 0;
}*/
.step_block .step_contents{
	background-color: #fff;
	margin-bottom: 30px;
}
@media only screen and (max-width: 736px) {
	.step_block .step_contents{
		margin-bottom: 5%;
	}
}
.step_block .step_contents h4{
	background-color: #000;
	color: #fff;
	padding: 15px 20px 15px 8em;
	font-size: 120%;
	letter-spacing: 0.1em;
	position: relative;
}
.step_block .step_contents h4 span.step{
	background-color: #aacc03;
	padding: 15px 30px 15px;
	margin-right: 20px;
	color: #000;
	position: absolute;
	top: 0;
    left: 0;
}
.step_block .step_ttl span.period{
	border: 1px solid #fff;
	padding: 0 2%;
	border-radius: 0;
	font-size: 80%;
	margin-left: 10px;
	font-weight: 400;
	position: absolute;
	right: 20px;
}
@media only screen and (max-width: 736px) {
	.step_block .step_contents h4{
		padding: 15% 8% 3%;
	}
	.step_block .step_contents h4 span.step{
		padding: 7px 30px;
		width: 100%;
    	text-align: center;
	}
	.step_block .step_ttl span.period{
		color: #000;
		top: 8px;
		border: 1px solid #000;
	}
}
.step_block .step_contents p{
	padding: 30px;
}
.step_block .triangle{
	width: 0;
	height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 10px solid black;
    margin: 0 auto 30px;
}
@media only screen and (max-width: 736px) {
	.step_block .step_contents p{
		padding: 5% 8%;
	}
	.step_block .triangle{
		margin: 0 auto 5%;
	}
}

/*取次パートナーがおすすめの企業*/
.ossm_contents{
	border: 1px solid #cbcbcb;
    display: flex;
	justify-content: space-around;
	align-items: center;
	padding: 30px;
	margin-bottom: 10px;
	border-radius: 10px;
}
@media only screen and (max-width: 736px) {
	.ossm_contents{
		display: block;
	}
}
.ossm_contents .img{
	width: 300px;
}
.ossm_contents .txt{
	width: 550px;
}
@media only screen and (max-width: 736px) {
	.ossm_contents .img{
		width: 100%;
		text-align: center;
        margin-top: 5%;
	}
	.ossm_contents .txt{
		width: 100%;
	}
}
.ossm_contents .txt .number{
	background: linear-gradient(90deg, #1b6e38 0%, #3f975e 40%, #46ab66 80%);
	font-size: 50px;
	font-weight: 700;
	line-height: 1.2em;
	display: inline-block;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.ossm_contents .txt h4{
	font-size: 150%;
	line-height: 1.3em;
	margin-bottom: 30px;
	position: relative;
}
.ossm_contents .txt h4::before {
	background: linear-gradient(90deg, #1b6e38 0%, #3f975e 40%, #46ab66 80%); /* 線の色 */
	border-radius: 99em; /* 線の両端を丸く */
	bottom: -15px; /* 線の位置 */
	content: "";
	height: 3px; /* 線の高さ */
	position: absolute;
	width: 30px; /* 線の長さ */
}
.ossm_contents .txt h4 .c_green{
	color: #247842;
}
.ossm_contents .txt .explanation{
	margin-bottom: 20px;
}
.ossm_contents .txt .example {
	font-size: 90%;
}
.ossm_contents .txt .example p.ttl{
	border: 1px solid #000;
	border-radius: 99em;
	display: inline-block;
	padding: .5% 5%;
	margin-bottom: 5px;
	font-size: 85%;
}


/*お支払いまでのステップ*/
.bg_circle_lightgreen{
	margin: 3% 0 0 !important;
}


/*QTモバイル取次パートナーの魅力*/
@media only screen and (max-width: 736px) {
	.list_otoku li{
		width: 100%;
		margin-bottom: .3em;
	}
	.list_otoku li >img{
		padding: 0;
	}
}