@charset "utf-8";

/* TOP画像 */
#top_img{
	margin: 10px 0px;
/*	border: 1px solid #000;	*/
	width: 748px;
	height: 200px;
}

/* メインテキスト */

div.mein_text{
	padding-left: 1em;
	font-size: 110%;
}

div.mein_text p{
	padding: 0.7em 0;
	line-height:1.5em;
	letter-spacing:0.1em;
}

/* タイトル */

.title{
	margin: 1em 1em 1em 0;
	padding: 0.5em;
	background: #0075c1;
	font-size: 120%;
	color: #FFF;
	letter-spacing:0.1em;
	box-shadow: 0px 8px 1px -3px rgba(0, 0, 0, 0.3);
}

#selhope_chart div.title h4{
	font-weight: normal;
	text-shadow:1px 1px 2px #000;
}

/* チャート*/

#selhope_chart ul{
	margin-top:30px;
}
.numbering{
	counter-reset: 1;
}

h5{
position: relative;
font-size:130%;
background: #afeeee;
padding: 0.25em 0.5em;
border-left: solid 2em #5c9ee7;
}

h5:before {
font-family: "Font Awesome 5 Free";
position: absolute;
padding: 0em;
color: white;
font-weight: normal;
left: -1.35em;
top: 50%;
-moz-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

h5.one:before{ content:"1";}
h5.two:before{ content:"2";}
h5.three:before{ content:"3";}
h5.four:before{ content:"4";}
h5.five:before{ content:"5";}
h5.six:before{ content:"6";}
h5.seven:before{ content:"7";}
h5.eight:before{ content:"8";}
h5.nine:before{ content:"9";}
h5.ten:before{ content:"10";}

#selhope_chart p{
	padding: 20px 0 5px 0px;
}

#selhope_chart ol{
	padding: 15px 0 20px 10px;
	margin:0 0 10px 0;
}

#selhope_chart ol li{
	padding-left: 1.8em;
	list-style-type:none;
	list-style-position:inside;
	counter-increment: cnt;
}

#selhope_chart ol li:before{
	display: marker;
	content: "(" counter(cnt) ") ";
}

.pdg-t10{padding-top: 10px;}
.pdg-t20{padding-top: 20px;}
.pdg-l1e{padding-left: 1em;}
.font110{font-size: 110%;}
.font120{font-size: 120%;}