/*===============================================
●style.css 画面の横幅が730px以上
===============================================*/
@media screen and (min-width: 730px){

body{
/*	background-color: yellow;*/
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}

#container{
	width: 730px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

#header-container{
	top: 0px;
	left: 0px;
	width: 100%;
	position: relative;
	z-index: 1;
}

#main-container{
	top: 30px;
	width: 730px;
	position: relative;
	z-index: 1;
}

#menu {
	width: 215px;
	margin-right: 15px;
	float: right;
	position: relative;
}

#contents {
	float: right;
	width: 500px;
	position: relative;
}

#footer {
	clear: both;
	width: 730px;
	height: 70px;
	background-color : #fff;
}

/* メニューの文字が多いとき */
.menusmall{
	font-size: 90%;
}

}


/*===============================================
●tablet.css 画面の横幅が719pxまで
===============================================*/
@media screen and (max-width: 719px){

body{
/*	background-color: #5a79ba;*/
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}

#container{
	width: 100%;
	border: solid 1px;
}

#header-container{
	width: 100%;
}

#main-container{
	width: 95%;
	margin: 0 auto;
}

#menu {
	padding-top: 30px;
	width: 80%;
	margin: auto;
	font-size: 90%;
	line-height: 2em;

}

#footer {
	width: 100%;
	height: 30px;
}

}


/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){

body{
/*	background-color: #f6bfbc;*/
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;　
}

#container{
	width: 100%;
	border: solid 1px;
}

#header-container{
	top: 0px;
	left: 0px;
	width: 100%;
	position: relative;
	z-index: 1;
}

#main-container{
	width: 95%;
	margin: 0 auto;
}

#menu {
	padding-top: 30px;
	width: 80%;
	margin: auto;
	font-size: 90%;
	line-height: 2em;
}

#footer {
	width: 100%;
	height: 20px;
}

}