/*===============================================
●sp.css  画面の横幅が737px〜0pxまで
===============================================*/

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

	body{ -webkit-text-size-adjust: 100%;}
	/*=====================
	　header
	=====================*/
	header h1{width: 70%;}
	.drawer-menu li{width: 100%;}
	.drawer-menu li:first-child{width: 80%;}
	.spNavHome a img{
		width: 100%!important;
		height: auto!important;
	}
	/*=====================
	　index
	=====================*/
	#indexContents{padding: 3% 3% 0 3%;}
	.indexIllust span{width: 45%;}
	.clip{
		width: 180px;
		height: 34px;
	}
	.indexMenu ul li a{padding: 10px;}
	/*=====================
	　footer
	=====================*/
	footer{padding: 5%;}
	
	/*=====================
	　spage
	=====================*/
	#spageContents{
		padding: 5%;
		border-radius: 15px;
	}
	.spageWrap{border: 15px solid #fff;}
	.ttl{padding-top: 10px;}
	.ttlIcon{
		width: 18%;
		padding-right: 10px;
	}
	.ttlIcon img{
		width: 100%;
		height: auto;
	}
	.ttlText{font-size: 1.8rem;}
	article{width: 100%;}
	/*========テキスト枠=========*/
	.spageTextBox h3{font-size: 1.6rem;}
	
	/*========flex=========*/
	.spageFlexBox60,.spageFlexBox35,.spageFlexBox50,.spageFlexBox45,.spageFlexBox30{
		width: 100%;
		margin-top: 10px
	}
	/*=====================
	　mamechishiki
	=====================*/
	.mameImg{width: 15%;}
	.qText{font-size: 1.6rem;}
	.aBox p{font-size: 1.6rem;}
	.qText{
		margin-left: 10px;
		padding: 5%;
	}
	.qText:before{
		border-width: 5px 10px 5px 0;
		top: 0;
		left: -10px;
		bottom: 0;
	}
	.aBox p{
		margin-right: 10px;
		padding: 5%;
	}
	.aBox p:before{
		border-width: 5px 0 5px 10px;
		top: 0;
		right: -10px;
		bottom: 0;
	}
	/*=====================
	　shigoto
	=====================*/
	.illustBox{width: 15%;}
	.staffText{
		margin-right: 10px;
		margin-top: 3%;
		padding: 5%;
	}
	.staffText:before{
		border-width: 5px 0 5px 10px;
		top: 0;
		right: -10px;
		bottom: 0;
}
	.kidsText{
		margin-left: 10px;
		margin-top: 3%;
		padding: 5%;
	}
	.boy:before,.girl:before{
		border-width: 5px 10px 5px 0;
		top: 0;
		left: -10px;
		bottom: 0;
	}
	.first{order: -1;}
}
/*===============================================
●sp.css  横向き
===============================================*/
@media screen and (max-width:812px) and (orientation: landscape) {
	.spageHeader{padding: 1.5% 0 0 1.5%}
}