@charset "UTF-8";

/* CSS Document */

@media screen and (min-width: 1024px) and (max-width: 1280px) {
  /* 1024px以上、1279px以下の画面幅に適用されるスタイル */	
	.header {
	padding-top: 30px;
	justify-content: space-around;
	}
	.logo-h {
	margin: 0 auto;
	}
	.header img {
	max-width: 580px;
	}
	section.menu {
	padding: 0 1rem;
	}  
	.message h2 {
	font-size: 2rem;
	} 
}

@media screen and (min-width: 600px) and (max-width: 1023px) {
  /* 600px以上、1024px以下の画面幅に適用されるスタイル */
	.header {
	justify-content: space-around;
	}
	.logo-h {
	margin: 0 auto;
	}	
	.header img {
	max-width: 480px;
	}
	h2.menutitle {
	margin-top: 3rem;
	}
	section.menu {
	padding: 0 1rem;
	}  
	footer .flex-menu {
	padding: 0 1rem;
	}
	.menubox p {
	font-size: 1rem;
	}	
	.drawing {
	margin: -3% auto ;
	}
	.bt-side-l img, .bt-side-r img {
	max-width: 150px;
	}	
}


@media screen and (max-width: 599px) {
  /* 600px以下の画面幅に適用されるスタイル */
	.logo-h {
	margin: 0 auto;
	}	
	h3 {
	margin: 2rem auto 2.5rem auto;
	}
	.container2 {
	padding: 3rem 0 6rem 0;
	}
	.drawing {
	width: 50%;
	margin: -3% auto ;
	}
	.drawing2 {
	width: 40%;
	}
	.drawing3 {
	width: 40%;
	}
	.drawing4 {
	width: 40%;
	}
	.message {
	margin: 3rem auto;
	}
	.message h2 {
	font-size: 1.8rem;
	text-align: center;
	}
	.message p {
	margin-bottom: 1rem;
	letter-spacing: .1rem;
	line-height: 2.2rem;
	font-size: 1rem;
	text-align: center;
	}
	section.menu {
	padding: 0 1rem;
	}
	.menutitle {
	margin-top: 5rem;
	}
	h3 {
	font-size: 1.8rem;
	}
	dt {
	font-size: 1.3rem;
	width: 100%;
	}
	p, dd, span {
	font-size: 1rem;
	}
	.menubox p span {
	font-size: .8rem;
	}
	footer section {
	padding: 0rem 1em 0 1em;
	}
	footer h2 {
	margin: 2rem;
	}
	.logo-f {
	width: 250px;
	}
	footer dt {
	line-height: 2.4rem;
	}
	.bt-side-l img, .bt-side-r img {
	max-width: 100px;
	}	
}
