@charset "UTF-8";

#storeContainer {
padding: 0 2.5rem 12.5rem;
}
#storeContainerInner {
max-width: 1280px;
margin: 0 auto;
}
#storeContainer .storeConTtlWrap {
margin: 0 0 2rem;
}
#storeContainer .storeConTtlWrap .ttl {
letter-spacing: 0.2rem;
font-size: 2.5rem;
}
#storeContainer .storeConTtlWrap .txt {
margin: 2rem 0 0 0;
}
#storeContainer .storeMap {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
margin: 0 0 6rem 0;
}
#storeContainer .storeMap iframe {
width: 100%;
height: 100%;
border: 0;
}
@media screen and (max-width: 768px) {
#storeContainer {
padding: 0 20px 7.5rem;
}
#storeContainer .storeConTtlWrap .ttl {
font-size: 2rem;
}
#storeContainer .storeMap {
aspect-ratio: 1 / 1;
}
}
/* ------------------------- */
#storeContainer #storeListArea .ttlWrapA {
margin: 0 0 1rem 0;
}

/* ------------------------- */
#storeContainer #listNav {
margin: 3rem 0 0 0;
display: flex;
align-items: baseline;
flex-wrap: wrap;
gap: 0.5rem;
}
#storeContainer #listNav .listTtl {
color: #D0010E;
font-size: 0.875rem;
font-weight: normal;
font-family: "Zen Kaku Gothic New", YuGothic,'Yu Gothic', "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
}
#storeContainer #listNav .listNavWrap ul {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
}
#storeContainer #listNav .listNavWrap ul li button {
display: block;
background: #fff;
font-size: 0.875rem;
line-height: 1.0;
padding: 0.5rem 1rem;
border: 1px solid #D0010E;
border-radius: 1rem;
color: #D0010E;
appearance: none;
-webkit-appearance: none;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
#storeContainer #listNav .listNavWrap ul li button.ac {
background: #FFEEEF;
font-weight: 700;
outline: 1px solid #D0010E;
}
#storeContainer #listNav .listNavWrap ul li .icon {
fill: #D0010E;
width: 1rem;
height: 1rem;
}
@media (hover: hover) {
#storeContainer #listNav .listNavWrap ul li button:hover {
background: #D0010E;
color: #fff;
transition: .3s ease-out;
}
#storeContainer #listNav .listNavWrap ul li button:hover .icon {
fill: #fff;
}
}
/* ------------------------- */
#storeContainer .storeListWrap {
margin: 4.5rem 0 0 0;
}

#storeContainer .storeListWrap .store:not(:last-child) {
margin: 0 0 4.5rem 0;
}
#storeContainer .storeListWrap .store .storeTtlWrap {
position: relative;
display: flex;
flex-wrap: wrap;
align-items: center;
gap:0.5rem 2rem;
margin: 0 0 1.5rem 0;
}
#storeContainer .storeListWrap .store .storeTtlWrap::before {
width: 0.25rem;
height: 1.5rem;
background: #D0010E;
content: "";
position: absolute;
left: 0;
top: 0.375rem;
}
#storeContainer .storeListWrap .store .storeTtlWrap .ttl {
font-size: 1.5rem;
padding: 0 0 0 1.25rem;
letter-spacing: 0.1rem;
}
#storeContainer .storeListWrap .store .storeTtlWrap .icon {
display: flex;
gap: 0.5rem;
}
#storeContainer .storeListWrap .store .storeTtlWrap .icon li {
font-size: 11px;
font-weight: 700;
text-align: center;
padding: 2px 0.75rem;
border-radius: 2px;
background: #FFEEEF;
border-radius: 0.75rem;
}
#storeContainer .storeListWrap .store .storeWrap {
display: flex;
gap: 1.5rem 2rem;
}
#storeContainer .storeListWrap .store .storeWrap .imgBlock {
width: 100%;
max-width: 240px;
margin: 0 auto;
}
#storeContainer .storeListWrap .store .storeWrap .imgBlock img {
border: 1px solid #ccc;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock {
width: 100%;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl {
display: flex;
margin: 0;
gap:0rem 1rem;
justify-content: space-between;
width: 100%;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl:not(:last-child) {
margin: 0 0 0.5rem 0;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dt {
font-weight: 700;
font-size: 0.875rem;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd {
width: calc(100% - 5rem);
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd span {
padding: 0 0 0 0.75rem;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd a {
text-decoration: none;
color: #472427;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd .gmap a,
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl:last-child dd a {
text-decoration: underline;
color: #D0010E;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd a:hover {
text-decoration: none;
transition: .3s ease-out;
}
@media screen and (max-width: 768px) {
#storeContainer .storeListWrap .store .storeWrap {
flex-direction: column;
}
}
@media screen and (max-width: 440px) {
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl {
flex-wrap: wrap;
}
#storeContainer .storeListWrap .store .storeWrap .txtBlock dl dd {
width: 100%;
}
}

/* ------------------------- */

#storeContainer .shopListWrap {
margin: 4.5rem 0 0 0;
display: flex;
gap: 3rem;
flex-wrap: wrap;
}
#storeContainer .shopListWrap .shop {
width: calc((100% - 6rem) / 3);
}
#storeContainer .shopListWrap .shop .shopTtlWrap {
background: #FFEEEF;
border-radius: 4px 4px 0 0;
padding: 0.5rem 1rem;
}
#storeContainer .shopListWrap .shop .shopTtlWrap .ttl {
font-size: 1.0rem;
}
#storeContainer .shopListWrap .shop .shopAddWrap {
padding: 1rem;
}
#storeContainer .shopListWrap .shop .shopAddWrap dl {
margin: 0 0 0.5rem 0;
}
#storeContainer .shopListWrap .shop .shopAddWrap dl dt {
font-weight: 700;
font-size: 0.75rem;
}
#storeContainer .shopListWrap .shop .shopAddWrap dl dd a {
text-decoration: none;
color: #472427;
}
@media screen and (max-width: 1280px) {
#storeContainer .shopListWrap .shop {
width: calc((100% - 3rem) / 2);
}
}
@media screen and (max-width: 768px) {
#storeContainer .shopListWrap {
gap: 2rem;
}
#storeContainer .shopListWrap .shop {
width: 100%;
}
}
@media screen and (max-width: 440px) {
#storeContainer .shopListWrap .shop .shopAddWrap {
padding: 1rem 0 0 1rem;
}
}