@charset "utf-8";

/************************************************
 flow
************************************************ */

/* 導入の流れ */
#section_2 .frame {
	padding: 20px 20px 30px 20px;
	background: #FFFFFF;
}
/* タイトル */
#section_2 #main_ttl {
	width: 100%;
	max-width: 1000px;
	background: url(../img/ttl-h1_sp.png) no-repeat;
	background-size: 100%;
	height: 8.928vw;
	margin-bottom: 20px;
}
/* 説明文 */
#section_2 p.explain {
	margin-bottom: 30px;
	font-size: 12px;
	line-height: 18px;
}
/* content */
#section_2 .frame_left {
	position: relative;
	width: 100%;
	height: auto;
	background: #e3f8fc url(../img/ico_our.png) no-repeat;
	background-position: right 10px top 10px;
	background-size: 25%;
	border-radius: 10px;
	border: 1px solid #B2B2B2;
	padding: 3.571%;
	margin-bottom: 10px;
}
#section_2 .frame_left ul, 
#section_2 .frame_right ul {
	margin-left: 20px;
}
#section_2 .frame_left ul li, 
#section_2 .frame_right ul li {
	list-style-type: disc;
}
#section_2 .frame_left ul li a, 
#section_2 .frame_rigth ul li a {
	display: inline;
	color: #00aacc;
	text-decoration: underline;
}
#section_2 .frame_left .step_left {
	width: 71.428%;
	margin-right: 2.142%;
	margin-bottom: 25%;
}
#section_2 .frame_right {
	position: relative;
	width: 100%;
	height: auto;
	background: #EEEEEE url(../img/ico_customer.png) no-repeat;
	background-position: right 10px top 10px;
	background-size: 25%;
	border-radius: 10px;
	border: 1px solid #B2B2B2;
	padding: 3.571%;
	margin-bottom: 10px;
}
#section_2 .frame_right .step_right {
	width: 71.428%;
	margin-right: 2.142%;
	margin-bottom: 25%;
}
@media all and (min-width: 641px) {
	#section_2 .frame_left {
		background: #e3f8fc url(../img/ico_our.png) no-repeat;
		background-position: right 10px top 10px;
	}
	#section_2 .frame_left .step_left {
		margin-bottom: 30px;
	}
	#section_2 .frame_right {
		background: #EEEEEE url(../img/ico_customer.png) no-repeat;
		background-position: right 10px top 10px;
	}
	#section_2 .frame_right .step_right {
		margin-bottom: 30px;
	}
}
@media all and (min-width: 1024px) {
	#section_2 #main_ttl {
		background: url(../img/ttl-h1.png) no-repeat;
		height: 38px;
	}
	#section_2 .frame_left {
		position: relative;
		width: 749px;
		height: 110px;
		background: url(../img/frame_left.png);
		border: none;
		border-radius: 0;
		margin-bottom: 10px;
	}
	#section_2 .frame_left ul, 
	#section_2 .frame_right ul {
		margin-left: 0;
	}
	#section_2 .frame_left .step_left {
		position: absolute;
		top: 15px;
		left: 105px;
	}
	#section_2 .frame_left ul {
		position: absolute;
		top: 50px;
		left: 130px;
		font-size: 12px;
		width: 550px;
	}
	#section_2 .frame_right {
		position: relative;
		width: 759px;
		height: 110px;
		background: url(../img/frame_right.png);
		border: none;
		border-radius: 0;
		margin-bottom: 10px;
		float: right;
	}
	#section_2 .frame_right .step_right {
		position: absolute;
		top: 15px;
		left: 120px;
	}
	#section_2 .frame_right ul {
		position: absolute;
		top: 50px;
		left: 140px;
		font-size: 12px;
	}
}

