p.cont{
	font-size: 2.0em;
	font-weight: 200;
    margin: 50px 0px;
}
p.capt{
	font-size: 1.8em;
	font-weight: 800;
	text-align: center;
	padding-top: 10px;
}
h2{
	font-size: 3.5em;
	border-bottom: 5px red solid;
}
h3{
	display: block;
	padding: 0.5em;
	background: #3A93F3;
	border-radius: 2em;
	font-size: 2.5em;
	color: white;
}
h4{
	display: block;
	padding: 0.5em;
	font-size: 2em;
	font-weight: bold;
}
h3.red{
	background: #FE6C6E;
	color: white;
}
.haruko, .haruko:hover{
	line-height: 200%;
	font-size: 1.5em;
	padding: 12px 20px;
	border: none;
	background-color:darkblue;
	color: white;
	font-weight: bold;
	border-radius: 5px;
	text-decoration: none;
    box-shadow: 0px 1px 2px 2px #aaa; 
    border-bottom: 5px solid #000044;
}
 .haruko:hover{
     margin-top: 3px;
	 background-color: cornflowerblue;
    border-bottom: 3px solid #9df;
}
.mbr-section__container--isolated{
	padding-top: 10px;
	padding-bottom: 30px;
}
.small{
	font-size: 1.5em;
}
.point{
	display: block;
	padding: 0.2em 1em 1em;
}

.step{
	display: table-cell;
	background: #FFE8B9;
	padding: 15px;
	border-radius: 10px 0px;
}
.stepimg{
	display: table-cell;
	padding: 0px 15px;
}
.flow{
	display: table;
}
.flow1{
	font-size: 2.5em;
	color: red;
	border-bottom: 1px solid #F87A7C;
}
.eff4{
	width:60%;
}
.ban{
	max-width: 40vw;
}
.topimg{
	max-width: 40vw;
}
.intro{
	padding: 10px;
	color:#2C8CA3;
}
.ban2{
    max-width: 100%;
}
@media (max-width: 767px) {
.ban{
	max-width: 80vw;
}
.topimg{
	max-width: 100vw;
}
.stepimg{
	padding: 15px;
}
.eff4{
	width:90%;
}
.ban2{
    max-width: 70vw;
}

}
@media (min-width: 768px) {
    .haruko, .haruko:hover{
        font-size: 2em;
    }
}