@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100..900;1,100..900&family=Noto+Serif+JP:wght@200..900&display=swap');


/* CSSカスタマイズ */

.block-page-block--contents-swiper .swiper-pagination-bullet-active{
background: #003962;
}

.block-topic-path--list:not(:nth-child(2)){
display: none;
}

.block-page-block--contents-swiper{
margin: 5rem auto calc(5rem + 30px);
}


/* 店舗告知（全体） */

#Infomation,
#concept,
#open_info,
#campaign{
font-family: "Noto Serif JP", serif;
font-optical-sizing: auto;
font-weight: 300;
font-style: normal;
line-height: 1.8;
letter-spacing: 0.1em;
}

#Infomation h1{
margin: 3rem auto;
padding: 0 0 1rem;
border-bottom: 3px double #f0f0f0;
color: #003962;
background: #fff;
line-height: 1.5;
font-weight: 800;
}

#Infomation h2{
color: #003962;
line-height: 1.5;
}

#Infomation h2::after{
background: #8ec0b7;
}

#Infomation h3{
color: #003962;
line-height: 1.5;
font-weight: 700;
}

#Infomation .infomation_wrap{
padding: 0 1.5em;
}

#Infomation .link_box{
width: 960px;
display: flex;
flex-wrap: wrap;
margin: 0 auto 60px;
gap: 0.5rem 1.2%;
}

#Infomation .link_box a{
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 24.1%;
text-align: center;
padding: 1em;
border: 1px solid #003962;
border-radius: 5px;
color: #003962;
font-size: 14px;
font-weight: 500;
transition: all 0.3s ease-in-out
}

#Infomation .link_box a:hover{
color: #fff;
background: #003962;
}

#Infomation .link_box a::after{
content: "";
position: absolute;
top: calc(50% - 0.2em);
right: 0.8em;
width: 0.5em;
height: 0.5em;
border-right: 1px solid;
border-bottom: 1px solid;
transform: rotate(45deg);
}


/* オープン日時 */

#open_info{
margin: 5rem auto 0;
padding: 0 1.5em;
}

#open_info .storelogo{
display: block;
width: 30%;
margin: 2rem auto 0;
aspect-ratio: 400 / 329;
background-position: center;
background-size: cover;
}

#open_info .open_date{
margin: 0 auto;
font-size: 20px;
text-align: center;
font-family: "Jost", sans-serif;
line-height: 1.5;
font-weight: 400;
letter-spacing: 0;
}

#open_info .open_date span{
padding: 0;
font-size: 2.2em;
}

#open_info .open_date span::before{
content: none;
}

#open_info .open_text{
margin: 0 auto;
font-size: 20px;
font-weight: 800;
text-align: center;
color: #003962;
line-height: 1.5;
}

#open_info .store_info{
margin: 3rem 0 0;
text-align: center;
}

#open_info .store_info > dt{
display: block;
width: 100%;
margin: 1em 0 0;
padding: 0;
color: #003962;
background: none;
font-weight: 600;
}

#open_info .store_info > dt:first-of-type{
margin: 0;
}

#open_info .store_info > dd{
display: block;
width: 100%;
margin: 0 auto;
padding: 0;
}

#open_info .store_info > dd a{
text-decoration: underline;
}

#open_info .store_info > dd a:hover{
text-decoration: none;
}

#open_info .store_info > dd .sp_block{
display: none;
}


/* コンセプト */

#concept{
margin: 5rem auto;
padding: 5rem 1.5em 0;
border-top: 1px solid #f0f0f0;
}

#concept .feature{
margin: 0 auto;
display: flex;
flex-wrap: wrap;
}

#concept .feature > dt{
width: 100%;
margin: 3rem 0 0;
padding: 0;
text-align: initial;
font-weight: 700;
background: none;
font-size: 20px;
color: #003962;
line-height: 1.5;
}

#concept .feature > dt:first-of-type{
margin: 0;
}

#concept .feature > dd{
margin: 0.5em 0 0;
padding: 0;
width: 100%;
}


/* キャンペーン */

#campaign span.important{
color: #003962;
font-weight: 500;
}

#campaign dl{
display: flex;
flex-wrap:
wrap; gap: 1em 0;
margin: 0 auto;
}

#campaign dl > dt{
display: flex;
justify-content: center;
align-items: center;
width: 8em;
color: #fff;
background: #003962;
font-weight: 500;
}

#campaign dl > dd{
width: calc(100% - 9em);
}

#campaign .campaign_box{
margin: 3rem auto 0;
display: flex;
flex-wrap: wrap;
gap: 2rem 3%;
}

#campaign .campaign{
width: 48.5%;
display: flex;
flex-wrap: wrap;
align-self: flex-start;
gap: 1rem 2%;
}

#campaign .campaign_box > h4{
width: 48.5%;
margin: 0 auto;
color: #003962;
font-size: 20px;
}

#campaign .campaign li{
display: flex;
flex-wrap: wrap;
align-items: center;
width: 49%;
aspect-ratio: 1 / 1;
padding: 1em;
background-color: rgb(33 43 50 / 90%);
background-blend-mode: overlay;
background-repeat: no-repeat;
background-position: center;
background-size: cover;
color: #fff;
}

#campaign .campaign li h4{
margin: 0 auto 0.5em;
padding: 0 0 0.2em;
font-size: 16px;
}

#campaign .campaign li p{
font-size: 13px;
margin: 0.5em auto 0;
}

#campaign .campaign li p.limit{
text-align: right;
}

#campaign .campaign li p.limit span{
font-size: 25px;
font-weight: 500;
padding: 0 0.1em;
color: #003962;
}

#campaign .campaign li p.limit span::before{
content: none;
}


@media only screen and (max-device-width: 999px) {

/* SP 店舗告知（全体） */

#Infomation .infomation_wrap{
padding: 0 0.5em;
}

#Infomation .link_box{
margin: 0 auto 3rem;
width: 95%;
}

#Infomation .link_box a{
width: 49.4%;
height: 4.5em;
font-size: 1.3rem;
padding: 0 2em;
}


/* SP オープン日時 */

#open_info{
padding: 0 0.5em;
}

#open_info .storelogo{
width: 50%;
}

#open_info .open_date{
font-size: 1.6rem;
}

#open_info .open_date span{
font-size: 3rem;
}

#open_info .store_info > dd .sp_block{
display: block;
}


/* SP コンセプト */

#concept{
padding: 5rem 0.5em 0;
}

#concept .feature > dt{
font-size: 1.8rem;
}

#concept .concept a{
font-size: 1.4rem;
}


/* SP キャンペーン */

#campaign .campaign_box{
margin: 4rem auto 0;
gap: 3rem 3%;
}

#campaign .campaign_box > h4{
font-size: 1.6rem;
}

#campaign .campaign{
gap: 2rem 2%;
}

#campaign .campaign li{
width: 100%;
}

#campaign .campaign li h4{
font-size: 1.3rem;
}

#campaign .campaign li p{
font-size: 1.2rem;
}

#campaign .campaign li p.limit span{
font-size: 2rem;
}
}