@charset "utf-8";
/* ===================================================================
CSS topページ

file name  :shop.css
style info  :参加店舗
=================================================================== */
.list_box_02{
}

.list_box_02 h2{
color: #BC2B1C;
font-weight: bold;
font-size: 1.2em;
display: inline-block;
float: left;
margin: 0 20px 20px 15px;
}

.list_box_02 p.btn_base_01{
display: inline-block;
float: left;
}

.list_box_02 .list{
clear: both;
padding: 0 20px;
overflow: hidden;
text-align: center;
}

.list_box_02 .list .box{
border-bottom: 1px solid #EBEBEB;
padding: 0 0 15px 0;
overflow: hidden;
width:100%;
display: inline-block;
vertical-align: top;
margin: 0 0 15px 0;
}

.list_box_02 .list .box .info_box{
float: left;
width: 55%;
text-align: left;
}

.list_box_02 .list .box .img_box{
float: right;
width: 44%;
margin: 0 0 5px 0;
}

.list_box_02 .list .box .img_box img{
width: 100%;
}

.list_box_02 .list .box .address{
font-size: 0.8em;
}

.list_box_02 .list .box .timelimit_on{
text-align: center;
margin: 0;
background: #BC2B1C;
color: #ffffff;
padding: 3px 5px;
margin: 5px 0 0 0;
font-size: 0.9em
}

.list_box_02 .list .box .timelimit_on span{
font-size: 0.5em;
margin: 0 5px 0 0;
}

.list_box_02 .list .box .timelimit_off{
text-align: center;
margin: 0;
background: #696969;
color: #ffffff;
padding: 3px 5px;
margin: 5px 0 0 0;
font-size: 0.9em
}


.list_box_02 .list .box p.genre{
font-size: 0.8em;
text-align: left;
}

.list_box_02 .list .box p.shopname{
font-size: 1.1em;
font-weight: bold;
text-align: left;
}

.list_box_02 .list .box p.tel{
text-align: left;
}

.list_box_02 .list .box p.tel span,
.list_box_02 .list .box p.number span{
font-size: 0.5em;
background: #E3E3E3;
padding: 2px 5px;
display: inline-block;
margin: 0 5px 0 0;
}

.bottom_link ul{
text-align: center;
margin: 20px 0 40px;
}

.bottom_link li{
display: inline-block;
width: 30%;
}

.shop_info{
position: relative;
margin: 0 0 40px 0;
}
.info_text{
background-color: rgba( 0, 0, 0, 0.75 );
color: #ffffff;
position: absolute;
width: 80%;
top:0;
left:0;
right: 0;
margin: auto;
padding: 0 0 15px 15px;
}

.info_text .timelimit_on{
text-align: center;
position: absolute;
margin: 0;
top:0;
right: 0;
background: #BC2B1C;
background-color: rgba( 188, 43, 28, 0.8 );
color: #ffffff;
padding: 5px 20px 5px;
line-height: 1.2em;
font-weight: bold;
}

.info_text .timelimit_on span{
font-size: 0.5em;
font-weight: normal;
display: block;
}

.info_text .genre{
margin: 20px 0 10px 0;
font-size: 0.8em;
}

.info_text .shopname{
margin: 0 15px 10px 0;
font-size: 1.3em;
font-weight: bold;
}

.info_text .tel,
.info_text .receptiontime,
.info_text .holiday{
font-weight: bold;
}

.info_text .tel span,
.info_text .receptiontime span,
.info_text .holiday span{
font-weight: normal;
background: #E3E3E3;
color: #555555;
padding: 2px 5px;
display: inline-block;
margin: 5px 15px 0 0;
width: 7.5em;
text-align: center;
}

.info_text .tel a{
color: #ffffff;
}

.info_img{
padding: 30px 0 20px 0;
}

.info_img img{
width: 100%;
}

.shop_text{
margin: 0 20px 20px;
}

.menu_list{
margin: 0 0 30px 0;
}

.menu_list h2{
color: #BC2B1C;
font-weight: bold;
font-size: 1.2em;
margin: 0 20px 20px 15px;
}


.tab-panel{
width: 100%;
}
.tab-group{
width: 100%;
}
.tab{
flex-grow: 1;
cursor:pointer;
}
.panel-group{
margin: 0 20px 0;
}
.panel{
display:none;
}
.tab.is-active{
background: #BC2B1C;
color: #ffffff;
}
.panel.is-show{
display:block;
}

.tab-panel ul{
overflow: hidden;
border-bottom: 2px solid #BC2B1C;
width: 100%;
padding: 0 0 0 20px;
margin: 0 0 20px 0;

}

.tab-panel li{
float: left;
text-align: center;
background: #EBEBEB;
color: #AFAFAF;
padding: 7px 30px;
font-weight:bolder;
margin: 0 10px 0 0;
}

.menu_box{
border-bottom: 1px solid #EBEBEB;
padding: 0 0 15px 0;
overflow: hidden;
width:100%;
display: inline-block;
vertical-align: top;
margin: 0 0 15px 0;
}

.menu_box .info_box{
float: left;
width: 55%;
text-align: left;
}

.menu_box .info_box .menuname{
font-size: 1.2em;
font-weight: bold;
margin: 0 0 5px 0;
}

.menu_box .info_box .menutext{
font-size: 0.9em;
margin: 0 0 5px 0;
}

.menu_box .info_box .menuprice_01{
color: #BC2B1C;
font-size: 1.3em;
font-weight: bold;
}

.menu_box .info_box .menuprice_02{
color: #BC2B1C;
}

.menu_box .img_box{
float: right;
width: 44%;
margin: 0 0 5px 0;
}

.menu_box .img_box img{
width: 100%;
}

.all_shoplist p{
width: 18em;
}

.shop_information{
background: #FAF6F5;
}

.shop_information h2{
text-align: center;
color: #BC2B1C;
font-weight: bold;
padding: 20px 0 20px 0;
font-size: 1.2em;
}

.shop_information .left_box{
float: left;
width: 50%;
}

.shop_information .left_box .shop_name{
font-size: 1.2em;
font-weight: bold;
line-height: 1.3em;
margin: 0 0 10px 0;
}

.shop_information .left_box .shop_add{
margin: 0 0 5px 0;
}

.shop_information .left_box .shop_tel{
margin: 0 0 5px 0;
}

.shop_information .left_box .shop_fax{
margin: 0 0 15px 0;
}

.shop_information .left_box span{
background: #E3E3E3;
padding: 2px 5px;
display: inline-block;
margin: 0 5px 0 0;
}

.shop_information .information_box{
margin: 0 20px 30px;
overflow: hidden;
}

.shop_information .right_box{
float: right;
width: 50%;
text-align: right;
}

.shop_information .right_box img{
width: 90%;
}

.ggmap {
clear: both;
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
/*--------------------------------------------------------------------
▼画面サイズ（横幅）が640px以上の場合に適用
--------------------------------------------------------------------*/
@media screen and (min-width: 640px) {

.info_text {
width: 50%;
top: 115px;
left: auto;
right: 0;
}

.menu_box .info_box {
width: 80%;
}

.menu_box .img_box {
width: 20%;
}

.info_img img {
padding: 0;
width: 85%;
height: 350px;
object-fit: cover;
}

.shop_information .information_box {
margin: 0 50px 30px;
overflow: hidden;
}
.shop_information .left_box {
width: 70%;
}

.shop_information .right_box {
float: right;
width: 25%;
text-align: center;
}

}


@media screen and (min-width: 750px) {
.list_box_02 .list {
padding: 0 5px;
text-align: left;
}

.list_box_02 .list .box{
width:47%;
margin: 0 10px 20px 10px;
}

}
