@charset "utf-8";


@media screen and (min-width: 800px) {
}


@media screen and (max-width: 798px) {



}


#topMain {width:100%;margin:0 auto 50px auto;}


section:after {content:"";}

article{
overflow:hidden;
color:#666;
line-height:180%;
}

article p{
	margin-bottom:1em;
}


@media screen and (min-width: 800px) {

	section{
		width:1000px;
	margin:0 auto 60px auto;}
}



@media screen and (max-width: 798px) {

section{
box-sizing:border-box;
padding:0 5%;
}


}


h2,h3,h4{
	font-weight:normal;
	margin-bottom:1em;
}

h2{
	font-size:170%;
	text-align:center;
	letter-spacing:6px;
	color:#333;
	margin-bottom:2em;
}

/*h2 span{
	border-bottom:2px solid #31af9c;
}*/

h3{
	color:#31af9c;
	font-size:140%;
	text-align:center;
	letter-spacing:5px;
}

h3 span{
	border-bottom:2px solid #A4DCD3;
	padding: 0 10px;
	display:inline-block;
}


.menubox:after,
.flow:after {content:"";}



.menubox{
	width:100%;
	padding:2.5em 0 0;
	background-color: rgba(49,174,155,0.1);
	margin-bottom:3em;
}

.menubox h3{
	margin-bottom:1.5em;
}


.flex-container{
display:-webkit-box;
display:flex;
-webkit-flex-wrap:wrap;
flex-wrap: wrap;
flex-direction:row ;
/*justify-content:space-around;*/
justify-content:space-between;
padding-bottom:1.5em;}


.flex-container .menu{
	background-color: rgba(255,255,255,0.5);
	box-sizing:border-box;
	padding:1em;
	border-radius: 10px; 
-webkit-border-radius: 10px;  
-moz-border-radius: 10px
}


@media screen and (min-width: 800px){
.flex-container .menu{
	width:33%;
	margin-bottom:0.5%;

}
}

@media screen and (max-width: 798px) and (min-width: 401px){
.flex-container .menu{
	width:49.5%;
	margin-bottom:1%;

}
}


@media screen and (max-width: 400px) {
.flex-container .menu{
	width:100%;
	margin-bottom:1%;

}
}


.flex-container .menu h4{
	text-align:center;
	color:#333;
}
.flex-container .menu h4 img{
	display:block;
	margin:5px auto 15px;
	
}

.flex-container .menu p{
	line-height:160%;
	font-size:90%;
	margin-left:0.2em;
}



.flow{
	margin-bottom:10em;
}

.flow section:after {content:"";}



.flow h3{
	margin-bottom:2em;
}


.flow dl{
margin-bottom:1px;
background-color: rgba(49,174,155,0.05);
width:100%;}

.flow dl:after {content:"";}

.flow dl.last{
border-bottom:1px dotted #999;
}


.flow dt{
color:#333;
width:25%;
padding:5px 0 0;
border-top:1px dotted #999;
float:left;
}


.flow dt .fx{
display:-webkit-box;
display:flex;
}

.flow dt span{
	align-self:center;
}


.flow dt img{
	vertical-align:middle;
	margin:5px 15px 15px 10px;
	
}


.flow dd{
margin-left:25%;
border-top:1px dotted #999;
padding:15px 1em 10px 15px;
line-height:160%;
font-size:90%;
background:#fff;
min-height:90px;
}


.flow p{
	margin-left:0.2em;
	margin-bottom:0.5em;
}


.flow dd ul{
	margin-left:2em;
	margin-bottom:0.5em;
}

.flow dd ul li{
	list-style:disc;
}


@media screen and (min-width: 800px) {
	
.flow dd.mar1{
	padding-top:1.5em;
}

.flow dd.mar2{
	padding-top:2.5em;
}

}


@media screen and (max-width: 798px){
	
.flow dt{
color:#333;
width:100%;
padding:5px 0 0;
border-top:1px dotted #999;
background-color: rgba(49,174,155,0.05);
margin-bottom:0.8em;
}

.flow dt img{
	vertical-align:middle;
	margin:5px 15px 8px 10px;
	
}


.flow dd{
margin-left:0%;
min-height:auto;
}

.sp_none{
	display:none;
}

}