﻿@charset "utf-8";
/* CSS Document */

#top{
	margin-top:5rem;
	margin-bottom:5rem;
}
#top .mainimg{
	width:35.4%;
	font-size:0px;
	text-align:center;
}
#top .mainimg img{
	width: auto;
    max-height: 326px;
}
#top .right{
	width:62.5%;
}
#top .right h1 {
	margin-top:0.3em;
}
#top .right .lead{
	font-size:2rem;
	line-height:1.8;
	margin-bottom:1.5em;
}
#top .right dt{
	color:#EB0100;
	margin-bottom:0.5em;
}
#top .right dd{
	margin-bottom:2em;
}
#top .right dd:last-child{
	margin-bottom:0em;
}
#package{
	margin-bottom:4rem;
}
#package ul{
	justify-content:flex-start;
}
#package li{
	width:14.86%;
	text-align:center;
	margin-right:1%;
}
#package li p{
	font-size:0px;
	margin-bottom:0.5rem;
}
#package li p img{
	width: auto;
    max-height: 141px;
}
#local table{
	border:1px solid #ccc9c9;
	width:100%;
	margin-bottom:1em;
}
#local{
	margin-bottom:4rem;
}
#local a{
	color: #1489E2;
}
#local a:hover{
	text-decoration:underline;
}
#local table th{
	color:#2f2f2f;
	font-weight:bold;
	padding:1em;
	background-color:#f1eee9;
	border-right:1px solid #ccc9c9;
	vertical-align:middle;
}
#local table tr{
	border-bottom:1px solid #ccc9c9;
}
#local table td{
	padding:0.5em 1em;
	border-right:1px solid #ccc9c9;
	vertical-align:middle;
}
#local table td:nth-of-type(2),
#local table td:nth-of-type(3){
	width:16%;
	text-align:center;
}
#local .caption li{
	font-size:1.4rem;
	padding-left:1em;
	text-indent:-1em;
}
#local .caption_1{
	font-size:1.6rem;
	margin-bottom: 1em;
}
#local .caption_2{
	font-size:1.6rem;
}
#local .caption_3{
	font-size:1.6rem;
/*	margin-top: 1em;*/
}

/*---------------------------------------------------------------
横幅768px～1190pxまでのレイアウト
---------------------------------------------------------------*/
@media screen and (min-width:768px) and (max-width:1150px){
#top .right h1 {
	font-size:3.36vw;
}
#top .mainimg img {
    max-height: 34vw;
}
#package li{
	font-size:1.35vw;
}
#package li p img {
    max-height: 11.9vw;
}
#allergen .allergen_list li{
	font-size:1.35vw;
}


}





/*---------------------------------------------------------------
スマホレイアウト
---------------------------------------------------------------*/
@media screen and (max-width:767px){
#top{
	margin-top:2rem;
	margin-bottom:2rem;
	display:block;
}
#top .mainimg {
    width: 90%;
    padding: 2rem 0;
	margin:0 auto 5vw;
}
#top .mainimg img{
	max-width: 100%;
	max-height:100%;
}
#top .right {
    width: 100%;
}
#package ul {
	width:104%;
}
#package li {
    width: 30%;
    margin:0 2.9% 1em 0;
	line-height:1.3;
	font-size:1.5rem;
}
#package li p img {
    max-height: 29vw;
}
#local table th:nth-of-type(2), #local table th:nth-of-type(3) {
	white-space:nowrap;
}
#allergen .allergen_list li {
    width: 33%;
}




}
