@charset "utf-8";


.title_link{text-align:right;position:absolute;right:1em;top:1.5em;width:50%;}
.title_link a:after{content:"＞";display:inline-block;text-decoration:none;margin-left:0.3em;}

.search_block dt, .search_block dd {

padding: 0.5em 1em;
border-bottom: 0.1em solid #ccc;
}
.search_block dt {
white-space: nowrap;
font-weight: bold;
/*text-align: center;*/
}
.search_block label {
display: inline-block;
margin-right: 0.5em;
}
@media screen and (min-width:650px) { /*pc*/
.search_block {
display: table;
}
.search_block dl {
display: table-row;
}
.search_block dt, .search_block dd {
display: table-cell;
}
}
@media screen and (max-width:649px) { /*sph*/
.search_block label {
display: inline-block;
margin:0.5em 1em;
margin-left:0;
}
}
/*jsと連動するため、レスポンシブではなくclassでスマホのみに効くように指定*/
.phone_device .search_block dt:before{content:"▼";margin-right:0.3em;color:#ccc;}
.phone_device .search_block dt:after{content:"で絞り込む";}
.phone_device .search_block dd{display:none;}


.is-hide {
display: none;
}
.variation_box {
display: flex;
flex-wrap: wrap;
}
.variation_box li.var_list {
width: 32.3%;
border: 0.1em solid #ccc;
border-radius: 0.5em;
box-sizing: border-box;
margin: 0.5em 0.5%;
position: relative;
}
.variation_box li.var_list.about{width:100%;background:#f9f5e4;border:none;}
@media screen and (max-width:649px) { /*sph*/
.variation_box li.var_list {
width: 49%
}
}
.variation_box li.title {
width: 100%;
margin-top: 1em;
border: none;
font-weight: bold;
}

.variation_box li.title {
font-size: 1.3em;
}
.variation_box li a {
display: block;
/*text-align: center;*/
text-decoration: none;
}
.variation_box li img {
width: 100%;
}
.variation_box li a:hover {
opacity: 0.7;
}
.variation_box li p {
position: relative;
margin: 0.7em;
font-weight: normal;
}
.variation_box li a p {
padding-right: 1.5em;}
.variation_box li p span {
display: inline-block;
font-size: 0.85em;
}
.variation_box li a p:after {
content: "→";
display: block;
width: 1em;
height: 1em;
position: absolute;
right: 0;
top: 0;
bottom: 0;
margin: auto;
}
/*.variation_box li.dead{background:#f0f0f0;color:#999;}
.variation_box li.dead a{color:#999;}*/
.variation_box li.dead p:before {
margin-right:0.5em;
background: #fff;
border:0.1em solid #999;
/*color: #999;*/
z-index: 2;
padding: 0.1em 0.5em;
font-size: 0.75em;
line-height: 1;
}


#gara.variation_box li.dead p:before {
content: "廃版";
}
#item.variation_box li.dead p:before {
content: "なくなり次第終了";
}

#gara li[data-limited="予約"] p:before,
#gara.variation_box li.dead p:before,
#item.variation_box li.rsv p:before {
content:"予約限定";
display:inline-block;
background:#555;
text-align:center;
margin-right:0.5em;
vertical-align:bottom;
color:#fff;
padding:0.5em;
font-size:0.75em;
line-height:1;
}