/* CSS Document */

/*  ���Ќ��̃X�e�b�v�@*/


#contents_step{ /* ���Ќ��̃X�e�b�v�@���g �ݒ� */
	width:1000px;
	height:outo;
	padding-top:50px;
	background-color:#ffffff/*#66CCFF*/;
	margin:0 auto;
}

/*�㉺�i�{�b�N�X*/
.boxa{
	width:1000px;
	height:600px;
	margin-bottom:50px;
	background-image:url(../image/2035.gif);
}

/* �т̉��e�L�X�g*/



.titlebar,.titlebar2{
	width:1000px;
	margin-bottom:50px;
	float:left;
}


/*  �E��BOX �ݒ��@�@*/

/*  �E���@���g     */

#step_txt{
	width:900px;
	height:180px;
	text-align:left;
	font-size:150%;/*130*/
	margin:30px 50px;
	line-height:170%;
	/*background-color:#CCCCFF;*/
}
.nagare{
	width:302px;
	height:530px;
	text-align:left;
	float:right;
	/*background:#CCFF99;*/
}


h2.kensyu {
	width:302px;
	height:42px;
	/*background-color:#66FFFF;*/
	text-align:center;
	line-height:42px;
	font-size:180%;
	color:#00AAD9;
}

.arrow {
	width:302px;
	height:32px;
	text-align:center;
}



p.honbun {
	width:282px;
	height:76px;
	padding:10px 10px 10px;
	display:block;
	text-align:left;
	line-height:140%;
	background-color:#FFFFFF;
	opacity: 0.55; /* 55���s�����x�i��45�����߁j
	/*background-color: transparent;  ����*/
	text-align:left;
	overflow:hidden;
}


/*   ����boxb�̐ݒ� */

.boxb{
	width:1000px;
	height:550px;
	margin-bottom:50px;
	background-image:url(../image/2036.gif);/*������*/
}


.nagare2{
	width:302px;
	height:400px;
	text-align:left;
	float:right;
	/*background:#CCFF99;*/
}


h2.kensyu2 {
	width:302px;
	height:42px;
	/*background-color:#66FFFF;*/
	text-align:center;
	line-height:42px;
	font-size:180%;
	color:#00BD9C;
}





/*
* 2017/4/6
* 図をCSSで表示させる
*/
/* タイトル */
.step_title{
	background-color: #66C2C3;
	height: 90px;
	width: 1000px;
}
.step_title h1{
	color: #fff;
	font-size: 200%;
	height: 90px;
	line-height: 90px;
	width: 1000px;
}
/* SE */
.titlebar{
	background-color: #fff;
	border: 2px solid #00AAD9;
	height: 90px;
	width: 996px;
}
.titlebar h2 {
	display: table-cell;
  vertical-align: middle;
	color: #00AAD9;
	font-size: 150%;
	height: 90px;
	width: 996px;
}
/* Sales */
.titlebar2{
	background-color: #fff;
	border: 2px solid #00BD9C;
	height: 90px;
	width: 996px;
}
.titlebar2 h2 {
  display: table-cell;
  vertical-align: middle;
	color: #00BD9C;
	font-size: 150%;
	height: 90px;
	width: 996px;
}

/* 図 */
/*SE*/
.graph{
	width: 771px;
	margin: 0 auto;
	text-align: center;
	/*background:#66FF66;*/
}
.step1,
.step2,
.step3 {
	background-color: #fff;
  width: 215px;
	margin: 10px;
}
.step1,
.step2,
.step3,
.step_arrow {
	float:left;
}
.graph .step {
	border: solid 1px #00AAD9;
}
.graph:after ,
.graph2:after {
	height: 0;
	visibility: hidden;
	content: ".";
	display: block;
	clear: both;
}
.step_arrow {
	position: relative;
	height: 300px;
	line-height: 300px;
	width: 30px;
}
.graph .arrow {
	position: absolute;
  top: 130px;
	width: 0;
	height: 0;
	border: 30px solid transparent;
	border-left: 30px solid #00AAD9;
}
/* 表の中のタイトル */
.graph_title {
	background-color: #00AAD9;
	margin: 5px;
}
.graph_title h3 {
	color: #fff;
	font-size: 150%;
	padding: 10px 5px;
}
.graph_title h3 span {
	font-size: 200%;
}
/* 表の中のテキスト */
.graph_text {
	font-size: 115%;
	letter-spacing:0.8pt;
	line-height: 1.75;
	padding-top: 15px;
	padding: 10px;
	text-align: left;
	height: 200px;
}

/*Sales*/
.graph2{
	width: 771px;
	margin: 0 auto;
	text-align: center;
	/*background:#66FF66;*/
}
.graph2 .step {
	border: solid 1px #00BD9C;
}
.graph2 .arrow {
	position: absolute;
	top: 130px;
	width: 0;
	height: 0;
	border: 30px solid transparent;
	border-left: 30px solid #00BD9C;
}
.graph2 .graph_title {
	background-color: #00BD9C;
}