@charset "UTF-8";
/* ---------------------------------------------------------------
	Lunch.css
--------------------------------------------------------------- */
@media screen and (max-width:1100px) {
	#lunch #contents{ padding: 0 1%; box-sizing: border-box;}
	#lunch section  { width: 98% !important;}
	#lunch #tit_area h3 { padding: 30px 0 0; width: 55%;}
	#lunch #tit_area h3 span br{ display: none;}
	#lunch #tit_area>img { width: 42%;}

	#lunch .detail dl:nth-of-type(1),
	#lunch .detail dl:nth-of-type(4),
	#lunch .detail dl:nth-of-type(8){ width: 15.6%;}
	#lunch .detail dl:nth-of-type(2),
	#lunch .detail dl:nth-of-type(7){ width: 7%;}
}
@media screen and (max-width:768px) {
	#lunch .detail,
	#lunch .detail h4,
	#lunch .detail>div{ display: block; width: 100%;}
	#lunch .detail h4{ background: #f0e3d1 url(../img/arrow_off.png) no-repeat 97% center;}
	#lunch .detail h4.active{ background: #f0e3d1 url(../img/arrow_on.png) no-repeat 97% center;}
	#lunch .detail h4 span{ display: inline-block; margin: 5px 5px 5px 10px;}
	#lunch .detail h4 span br{ display: none;}
	#lunch .detail dl { float: none; width: 100% !important; height: auto !important; text-align: left; border-right: 0;}
	#lunch .detail .note{ border-top: 0;}
	#lunch .detail h5{ background: url(../img/arrow_off.png) no-repeat 97% center;}
	#lunch .detail h5.active{ background: url(../img/arrow_on.png) no-repeat 97% center;}
}
@media screen and (max-width:640px) {
	#lunch #tit_area h3 { margin: 10px 0 15px; padding: 0; width: 100%; float: none;}
	#lunch #tit_area h3 img{ margin: 0 auto 20px;}
	#lunch #tit_area>img { display: block; margin: 0 auto; width: 90%; max-width: 90%; float: none;}
}
@media screen and (max-width:480px) {
}