@charset "utf-8";
/*=============================================================
 feature Layout
=============================================================*/
/* feature-ttl
-------------------------------------------------------------*/


#contents h3{
	display: block;
	min-height: 35px;
	color: #fff;
	padding: 10px 10px;
	font-size: 120%;
	margin: 60px 0 10px 0;
}
#contents h3.n01{
	background-color:#0bb5b8;
}
#contents h3.n02{
	background-color: #0089b6;
}
#contents h3.n03{
	background-color: #d978ac;
}
#contents h3 span{
	font-size: 60%;
}

#contents h3 span.no{
	font-size: 150%;
}
#contents h3 span.no::after{
	content: "|";
}

#contents h4{
	font-size: 120%;
}
#contents .boxBdr{
	border: 2px solid #00a7ea;
}
#contents .boxBdr h4{
	position: relative;
	padding: 10px 0 0 0;
}

#contents .boxBdr h4::before{
	content: "";
	position: absolute;
	top: -50%;
	left: 0;
	border: 8px solid transparent;
	border-top: 15px solid #00a7ea;
}
#contents .boxBdr h5{
	color: #0088b6;
	margin: 20px 0 10px 0;
	font-size: 110%;
}
/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
 Smartphones
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++*/
@media only screen and (max-width:767px){
#contents .boxBdr h4::before{
	top: -45%;		
	}
#contents h3{
	font-size: 100%;
	min-height: 25px;
}
#contents h3 span{
	font-size: 50%;
}

#contents h3 span.no{
	font-size: 115%;
	
}
#contents h4{
	font-size: 100%;
}
#contents .boxBdr h5{
	font-size: 100%;
	}
	}
@media only screen and (max-width:408px){
	#contents .boxBdr h4::before{
	top: -35%;		
	}
}