@charset "UTF-8";

/*---------------------------------
ママフレ汎用テーマレスポンシブWebデザインCSS
----------------------------------*/
/*common style
-----------------------------------*/


/*layout mediaQuery*/
@media only screen and (max-width:1023px){
	#wrapper{
		margin: 10px 15px;
		padding: 0 20px 20px;
	}
	#header{
		margin-top: 0;
		height: auto;
		background: none;
	}
    #header.collabo{
        background:none;
	}
	#header h1{
		float: none;
		width: 100%;
		text-align: center;
	    position:static;
	}
		#header h1 img.pc{
			display: none;
		}
		#header h1 img.mobile{
			display: block;
		}
	#header #cityLogo{
		width:144px;
                height:36px;
		margin-bottom:0px;
	}
		#header #cityLogo img{
			max-width:144px;
                        max-height:36px;
		}
	#headerRight{
		margin: 0;
		position:static;
	}
	#bgChange,#sizeChange,
	#headerRight .navi{
		display: none;
	}
	#searchBtn{
		display: block;
		position: absolute;
		right: 10px;
		top: -5px;
		z-index: 99;
		padding: 5px 15px;
		width: 4em;
		text-align: center;
		border-bottom: 1px solid #e0bc2d;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
		border-radius: 5px;
		background: #f5e737; /* Old browsers */
		background: -moz-linear-gradient(top,  #f5e737 0%, #f5cb37 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5e737), color-stop(100%,#f5cb37)); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top,  #f5e737 0%,#f5cb37 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top,  #f5e737 0%,#f5cb37 100%); /* Opera 11.10+ */
		background: -ms-linear-gradient(top,  #f5e737 0%,#f5cb37 100%); /* IE10+ */
		background: linear-gradient(to bottom,  #f5e737 0%,#f5cb37 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5e737', endColorstr='#f5cb37',GradientType=0 ); /* IE6-9 */
	}
		#searchBtn a{
			color: #fff;
			font-weight: bold;
			text-decoration: none;
		}
	#headerRight form{
		position: absolute;
		top: -50px;
		left: 50%;
		z-index: 10;
		margin-left: -140px;
	}
		#headerRight form .word{
			padding: 7px 7px 7px 20px;
		}
	#navi{
	}
	#navi ul{
	}
	#navi li{
		margin-right: 0;
		width: 50%;
		float:left;
		text-align: left;
		border-bottom: none;
	}
	#navi li#naviSupport{
		display: block;
	}
	    #navi li a span{
	       padding-left:0px;
	    }
			#navi li a, #navi li a:hover{
				margin: 1px;
				padding: 10px 0 10px 10px;
				background: none;
				border: 1px solid #148644;
				-webkit-border-radius: 5px;
				-moz-border-radius: 5px;
				border-radius: 5px;
				background-size:20px 48px;
				background-repeat: no-repeat;
				background-origin:content-box;
				background-color: #f0faf4; /* Old browsers */
				background-color: -moz-linear-gradient(top,  #f0faf4 0%, #bedfcc 100%); /* FF3.6+ */
				background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f0faf4), color-stop(100%,#bedfcc)); /* Chrome,Safari4+ */
				background-color: -webkit-linear-gradient(top,  #f0faf4 0%,#bedfcc 100%); /* Chrome10+,Safari5.1+ */
				background-color: -o-linear-gradient(top,  #f0faf4 0%,#bedfcc 100%); /* Opera 11.10+ */
				background-color: -ms-linear-gradient(top,  #f0faf4 0%,#bedfcc 100%); /* IE10+ */
				background-color: linear-gradient(to bottom,  #f0faf4 0%,#bedfcc 100%); /* W3C */
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f0faf4', endColorstr='#bedfcc',GradientType=0 ); /* IE6-9 */
			}

			#navi li a.selected{
			    background-position:0px -24px;
				background-color: #5cb07f; /* Old browsers */
				background-color: -moz-linear-gradient(top,  #5cb07f 0%, #4c996c 100%); /* FF3.6+ */
				background-color: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#5cb07f), color-stop(100%,#4c996c)); /* Chrome,Safari4+ */
				background-color: -webkit-linear-gradient(top,  #5cb07f 0%,#4c996c 100%); /* Chrome10+,Safari5.1+ */
				background-color: -o-linear-gradient(top,  #5cb07f 0%,#4c996c 100%); /* Opera 11.10+ */
				background-color: -ms-linear-gradient(top,  #5cb07f 0%,#4c996c 100%); /* IE10+ */
				background-color: linear-gradient(to bottom,  #5cb07f 0%,#4c996c 100%); /* W3C */
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5cb07f', endColorstr='#4c996c',GradientType=0 ); /* IE6-9 */
			}

            /*(#navi li a.navi-home{
                background-image:url(./img/navi-home_small.png);
            }

            #navi li a.navi-service{
                background-image:url(./img/navi-service_small.png);
            }

            #navi li a.navi-advice{
                background-image:url(./img/navi-advice_small.png);
            }

            #navi li a.navi-link{
                background-image:url(./img/navi-link_small.png);
            }

            #navi li a.navi-useful{
                background-image:url(./img/navi-useful_small.png);
            }

            #navi li a.navi-bbs{
                background-image:url(./img/navi-bbs_small.png);
            }

            #navi li a.navi-hospital{
                background-image:url(./img/navi-hospital_small.png);
            }*/


	#content{
		float: none;
		margin-bottom: 1.5em;
	}
	#bread{
		font-size: 87.5%;
	}
	#contentInner{
		margin: 0;
	}
	#side{
		float: none;
		margin: 0 auto;
		/*width: 620px;*/
		width: auto;
		overflow: hidden;
		text-align: center;
	}
		#side .sideAd{
		/*	display: inline-block;*/
			margin: 0 5px 15px;
		}
		#side h3{
			text-align: center;
		}
		#side ul{
		}
		#side ul li{
			float: left;
			margin: 0 5px 10px;
		}
		#sideBunner{
			margin-top: 0;
		}
		#sideSocial{
			text-align: center;
		}
			#sideSocial ul{
				display: flex;
				flex-wrap: wrap;
			}
				#sideSocial ul li{
					flex: 1 1 auto;
					/* width: 130px;
					text-align: left; */
				}
	/*ad*/
	#contentAd .sideAd{
		display: inline-block;
		margin: 0 5px 15px;
	}
	#side .sp-top{
		display: none;
	}



	/*bottom banner
	-----------------------------------*/
	#bottomBanner{
	}
		#bottomBanner ul{
				text-align: center;
			}
		#localBanner li{
			display: inline-block;
			float: none;
			padding: 0px 5px 10px;
			width: auto;
		}

	#footer{
		font-size: 87.5%;
	}
		#footer .navi{
			margin: 0;
		}
		#footer #copy{
			position: static;
			text-align: center;
			font-size: 75%;/*12px*/
		}
		#footer .navi dt{
			float: none;
			width: auto;
			color: #333;
			font-weight: bold;
		}
		#footer .navi dd{
			margin: 0 0 1em 0;
		}
		#footerLogo{
			position: static;
			margin: 10px 0;
			text-align: center;
		}

	#topImage{
		display:none;
	}

}


@media only screen and (max-width:690px){
	#side{
		width: 100%;
	}
	#side #sideBunner{
		/*width: 300px;*/
		margin: 0 auto;
	}
	#side #sideBunner li{
		margin: 0 0 10px;
	}
		#sideSocial ul li{
			width: auto;
		}

	#getSourceLayer{
		width: 270px;/*290*/
		margin-left: -145px;
		padding: 30px 5px 5px;
		opacity: 0;
	}
	#getSourceLayer textarea{
		width: 250px;
		padding: 5px;
	}
}


@media only screen and (max-width:400px){
	#navi li a{
				padding-left: 5px;
			}
	#navi li#navi01 a:before,
	#navi li#navi02 a:before,
	#navi li#navi03 a:before,
	#navi li#navi04 a:before,
	#navi li#navi05 a:before,
	#navi li#navi06 a:before,
	#navi li#navi01.current a:before,
	#navi li#navi02.current a:before,
	#navi li#navi03.current a:before,
	#navi li#navi04.current a:before,
	#navi li#navi05.current a:before,
	#navi li#navi06.current a:before{
		content: "";
		display: none;
	}
}
@media only screen and (max-width:480px){
    #header{
		padding-top:0px;
    }
	#wrapper{
		margin: 0;
		padding: 10px;
		border-radius: 0;
	}
	#searchBtn{
		top: -15px;
	}
	#headerRight form{
		top: -60px;
	}
    .inline_block{
        text-align:center;
    }
    .field{
        width:100%;
        text-align:left;
    }
    .field_input{
        margin:auto;
    }
}

/*top
-----------------------------------*/
@media only screen and (max-width:480px){
	.recommend .column h3{
		/*padding-left: 20px;
		text-decoration: underline;
		cursor: pointer;
		background: url(./img/icons.gif) left -380px no-repeat;
*/	}
	.recommend .column h3.open{
		text-decoration: none;
		background-position: left -430px;
	}
	.recommend .column .tn{
		width: 150px;
	}



}

/*service
-----------------------------------*/
@media only screen and (max-width:1023px){
	#serviceHeader h2{
		float: none;
	}
	#serviceHeader ul{
		margin: 0;
	}
	.serviceList{
		float: none;
		width: 100%;
		margin-bottom: 2em;
		padding-right: 0;
	}
}



/*serviceCategory
-----------------------------------*/
/*page
-----------------------------------*/
@media only screen and (max-width:1023px){
	#servicePage #serviceTop{
		margin-bottom: 0;
	}
	#servicePage table{
	   width:100%;
	}

	#servicePage td{
		display: block;
	}

	#servicePage th{
		display: block;
	}

	#servicePage td p{
		padding-left:10px;
	}

	#servicePage .relativeLink dt{
		float: none;
	}
	#servicePage .relativeLink dd{
		margin: 0;
	}
}

@media only screen and (max-width:350px){
	#servicePage .inner{
		padding: 5px 5px 15px;
	}
	#servicePage .relativeLink{
			margin: 20px 10px;
		}
}




/*archive
-----------------------------------*/
.arichivePost{
}


/*固定ページ
-----------------------------------*/
/*オススメ情報*/
#content.fixedPage .tn{

}

/*ママフレ特集*/
@media only screen and (max-width:600px){
	#useful{
		background: none;
	}
}
/*保育サービスナビ*/
@media only screen and (max-width:600px){
	#hoikuServiceNavi .advice{
	padding: 0;
	background: none;
	}
}

/*子育てがつらいと思ったら*/
@media only screen and (max-width:600px){
	.bgPicMother{
		padding: 0;
		background: none;
	}
	.adviceTelList dl dt{
		padding: 0;
	}
	.adviceTelList dl dd{
		padding: 0 0 0 1em;
		background-position: 0 2px;
	}
}

/*救急*/
@media only screen and (max-width:600px){
	#hospital #section00 .inner img{
		margin-left: 70px;
		float: none;
	}
	#hospital dl dd{
		margin: 0 0 5px 0;
	}
		#hospital dl dd.tel{
			margin: 0 0 5px 0;
		}
}



/*妊娠出産・子育てに関する相談先*/
@media only screen and (max-width:600px){
	#advice #section00{
	background: none;
	}
}

/*妊娠出産・子育てに関する施設・窓口へのリンク*/
@media only screen and (max-width:600px){
	#links ul#sectionLink{
		padding: 15px 0 15px 0;
		background: none;
		min-height: 0px;
	}
}


/*ママフレナビ*/
@media only screen and (max-width:600px){
	#content.fixedPage #mamafreNavi h2{
		float: none;
	}
	#mamafreNaviHeader ul{
		margin: 0 0 5px;
	}
	#content.fixedPage #mamafreNavi h5{
		margin: 5px 0 5px 0;
		text-align: left;
	}
		#content.fixedPage #mamafreNavi h5.marginBottom7em,
		#content.fixedPage #mamafreNavi h5.marginBottom6em,
		#content.fixedPage #mamafreNavi h5.marginBottom5em{
			margin-bottom: 0;
		}
	#mamafreNavi .timeLine{
		background: none;
	}
		#mamafreNavi .timeLine .period{
			padding: 0;
		}
		#mamafreNavi .timeLine .period h4{
			position: static;
		}
		#mamafreNavi .timeLine .sixmonth{
			position: static;
			top: 0;
		}
		#mamafreNavi .timeLine .month{
			float: none;
			padding: 0;
			overflow: hidden;
		}
		#mamafreNavi .timeLine .inner{
			margin: 0;
			padding: 5px 0 0;
		}
}

/*小児救急電話相談*/
@media only screen and (max-width:320px){
	#content.fixedPage dl.contactTime dt{
		width: 50px;
	}
	#content.fixedPage dl.contactTime dd{
		margin: 0 0 0 60px;
	}
}
/*当サイトの利用について*/
@media only screen and (max-width:600px){
	#about .message{
		background: none;
	}
}
/*利用規約*/

/*お探しの情報が見つかりません*/
@media only screen and (max-width:700px){
	#notfound{
		background: #204398; /* Old browsers */
background: -moz-linear-gradient(top,  #204398 1%, #ffffff 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,#204398), color-stop(100%,#ffffff)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #204398 1%,#ffffff 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #204398 1%,#ffffff 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #204398 1%,#ffffff 100%); /* IE10+ */
background: linear-gradient(to bottom,  #204398 1%,#ffffff 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#204398', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

	}
}
@media only screen and (max-width:500px){
	#notfound{
		height: auto;
		padding: 10px;
		color: #333;
		text-align: left;
		background: no-repeat;
		border: 2px solid #204398;
	}
		#notfound h2{
			color: #204398;
		}
	#notfoundInner{
		height: auto;
		background: none;
	}
		#notfoundInner ul{
			position: static;
			margin-left: 20px;
		}
			#notfoundInner ul li{
				padding: 0;
			}
			#notfoundInner ul li.home,#notfoundInner ul li.previous,#notfoundInner ul li.sitemap,#notfoundInner ul li.mail{						list-style-type: disc;
				background:none;
			}
}


/*retina
-----------------------------------*/
@media screen and (-webkit-min-device-pixel-ratio: 2){
	#bread li a{
		background: url(./img/img_arrow01x2.png) right center no-repeat;
		-webkit-background-size: 9px 10px;
	}
}

/*更新関連
-----------------------------------*/
/*ファミリー・サポート・センター*/
@media only screen and (max-width:600px){
	#familySupport .pc{
		display: none;
	}
}
