/* index.php のスライド画像 */

.strasse {
	position: relative;
	list-style: none;
	overflow: hidden;
	width: 100%;
	padding: 0;
	background: #fff;
	/*  margin-top: -13px;
	  margin-bottom: 30px;*/
}

.strasse li {
	-webkit-backface-visibility: hidden;
	position: absolute;
	display: none;
	width: 100%;
	left: 0;
	top: 0;
}

.strasse li:first-child {
	position: relative;
	display: block;
	float: left;
}

.strasse img {
	display: block;
	height: auto;
	float: left;
	width: 100%;
	border: 0;
}

/*メディアクエリの指定（※widthが768px以下の場合に{}内のCSSを適用する）*/
@media screen and (max-width: 768px) {

	#header .flower{
		margin-top: -110px;

	}

	#header .logo {
		width: 100%;
	}


	   #header .logo2 {
	width: 29%;
/*	float: right;*/
	padding: 10px 0;
	margin-top: 18px;
	margin-right: -40px;
	position: absolute;
}


/*	#contents_left {
		width: 98%;
		float: none;
	}

	#contents_right {
		width: 98%;
		float: none;
		margin-left: 1%;
	}*/

	/* グローバルナビ */

	#nav li {
		display : table;
		width : 24.8%;
		float: left;
	}

	#nav li:nth-child(-n+4) {
		border-bottom: 1px solid #ccc;;
	}

	#nav li:nth-child(4n) {
		border-right: none;
	}


	.left_m   {
	display: inline-block;
	width: 25%;
	height: auto;
	margin: 20px 30px 15px 20px;
	font-size: 15px;
	line-height: 22px;
}


#contents_left {
	/* width: 680px; */
	width: 50%;
	margin: 0;
	float: left;
}
#contents_right {
	/* width: 320px; */
	width: 32%;
	margin-left: 0px;
	vertical-align: top;
	float: right;
}


.msg   {
	color: #bb0000;
}

#right_p {
	display: inline-block;
	margin: 20px 0;
	width: 30%;
	max-width: 210px;
	background: #fff;
	vertical-align: top;
}

#right_p img {
	width: 100%;
	display: block;
	background: #fff;
}

.middle_m  {
	display: inline-block;
	width: 25%;
	height: auto;
	font-size: 15px;
	line-height: 22px;
	margin-top: 20px;
	margin-right: 30px;
	vertical-align: top;
}




    #facebook   {
    width: 98%;
    margin-left: -15px;
    vertical-align: top;
    }

#footer   {
    width: 100%;
    }


	footer p {
		font-size: 60%;
	}

}

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

	#header .flower{
		margin-top: -90px;

	}

	#headlogo {
		width: 154px;
	}

	#header .logo {
		width: 100%;
	}

	#header .logo2 {
		width: 32%;
	/*	float: right;*/
		padding: 10px 0;
		margin-top: 0px;
		margin-right: -40px;
		position: absolute;
	}

	#header h2 {
		margin-right: 20px;
		padding-top: 7%;

	}

	#header h3 {
		margin-right: 20px;
		padding-top: 10%;

	}

	#header h2 a  {
	    color: #660000;
	    }

	#header h3 a  {
	    color: #660000;
	    }

    #header h4  {
       margin-top: 55px;
       margin-right:10px;
       }





	#header p .top   {
     font-size: 14px;
     margin-top: 3px;
     margin-bottom: 5px;
     line-height: 20px;
     }

	/* グローバルナビ */

	#nav li {
		display : table;
		width : 49.6%;
		float: left;
	}

	#nav li:nth-child(-n+6) {
		border-bottom: 1px solid #ccc;;
	}

	#nav li:nth-child(2n) {
		border-right: none;
	}


      #contents_left {
	/* width: 680px; */
	width: 50%;
	margin: 0;
	float: left;
}
    #contents_right {
	/* width: 320px; */
	width: 32%;
	margin-right: 10px;
	margin-left: -20px;
	float: right;
	vertical-align: top;
}

.left_m  {
        display: block;
        width: 90%;
        }

.middle_m  {
        display: block;
        width: 90%;
        margin-left: 25px;
        }
.msg   {
	color: #bb0000;
}

#right_p {
   display: block;
	margin: 20px 0;
	width: 100%;
	max-width: 300px;
	background: #fff;
	vertical-align: top;
}

#right_p img {
	width: 100%;
	display: block;
	background: #fff;
}

.

#contents_right {
	/* width: 320px; */
	width: 96%;
	margin: 0 auto;
	vertical-align: top;
	float: none;
}

#facebook   {
    width: 100%;
    margin-left: 3%;
    vertical-align: top;
    }



footer img {
		width: 40%;
	}

footer p {
		font-size: 70%;
	}


	#box img, .box img {
	float: none;

}



#map_canvas {
	float: none;
}


}

/*メディアクエリの指定（※widthが480px以下の場合に{}内のCSSを適用する）*/

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

	#header .flower{
	margin-top: -70px;
	}

	#headlogo {
		width: 128px;
	}

	#header .logo {
		width: 100%;
	}

	#header .logo2 {
		width: 34%;
		/*	float: right;*/
		padding: 10px 0;
		margin-top: 0px;
		margin-right: -40px;
		position: absolute;
	}

	#header h2 {
		margin-right: 20px;
		padding-top: 10px;

	}

	#header h3 {
		margin-right: 20px;
		padding-top: 4px;
	}

	#header h4 {
		margin-right: 22px;
		margin-top: 52px;
	}

	#header img   {
	    width:80%;
	    }


    #header p .top   {
     font-size: 14px;
     margin-top: 3px;
     margin-bottom: 5px;
     line-height: 20px;
     }


	/* グローバルナビ */

	#nav li {
		display : table;
		width : 49.6%;
		float: left;
	}

	#nav li:nth-child(-n+6) {
		border-bottom: 1px solid #ccc;;
	}

	#nav li:nth-child(2n) {
		border-right: none;
	}

	#box img, .box img {
		float: none;
		width: 115%;
	}

	#headline2{
		width: 98%;
	}


    .left_m  {
        display: block;
        width: 90%;
        }

    .middle_m  {
        display: block;
        width: 90%;
        margin-left: 25px;
        }

     #right_p  {
        display: block;
        width: 96%;
        height: auto;
        margin-left: 10px;
        }

    #right_p img {
       display: block;
        width: 100%;
        height: auto;
        margin-left: 20px;
        }

	 #contents_left  {
         float: none;
         width: 98%;
        margin-top: 0;
        }


	#box .store_info, .box .store_info {
		width: 81%;
	}

	#map_canvas {
		float: none;
		width: 107%;
	}

	#map_canvas p {
		margin: 20px 0 15px 20px;
	}



    #contents_right  {
         float: none;
         width: 98%;
        margin-top: 0;
        margin-left: 20px;
        }
   #facebook   {
       margin-left: 20px;
       width: 100%;

       }

}