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

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

#Infomation,
#schedule,
#sale,
#campaign{
font-family: "Noto Sans JP", sans-serif;
font-optical-sizing: auto;
font-weight: 400;
font-style: normal;
}

#Infomation h1{
background: #008fab;
color: #fff;
margin: 0 auto 3rem;
}

#Infomation h2{
color: #008fab;
}

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

#Infomation h3{
color: #008fab;
}

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

#Infomation .open_date{
margin: 0 auto;
color: #008fab;
font-size: 20px;
font-weight: bold;
text-align: center;
}

#Infomation .open_date span{
padding: 0;
font-size: 40px;
}

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

#Infomation .open_info{
margin: 2rem auto 0;
display: flex;
flex-wrap: wrap;
}

#Infomation .open_info p{
margin: 1em auto 0;
}

#Infomation .open_info > dt{
display: flex;
justify-content: center;
align-items: center;
width: 8em;
margin: 1em 0 0;
color: #fff;
background: #008fab;
font-weight: bold;
}

#Infomation .open_info > dd{
margin: 1em 0 0;
width: calc(100% - 9em);
}

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

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

#Infomation .feature{
display: flex;
flex-wrap: wrap;
}

#Infomation .feature > dt{
width: 100%;
margin: 3rem 0 0;
padding: 0;
color: #008fab;
text-align: initial;
font-weight: bold;
background: none;
font-size: 20px;
}

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


/* 店舗告知（個別） */

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

#Infomation .concept > div{
width: 49%;
padding: 1em;
border: 2px solid #008fab;
}

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

#Infomation .concept .catch_copy{
font-size: 19px;
font-weight: bold;
color: #008fab;
}


/* 店舗告知（休業案内） */

#schedule .schedule_info{
background: #008fab;
padding: 2em;
margin: 3rem auto 0;
color: #fff;
}

#schedule .schedule_head{
font-size: 20px;
font-weight: bold;
padding: 0.5em 1em;
border: 1px solid;
}

#schedule .schedule_box{
margin: 2em auto 0;
display: flex;
flex-wrap:wrap;
gap: 3rem 2%;
}

#schedule .schedule_box li{
width: 48%;
}

#schedule .schedule_box h4{
padding: 0 0 0.2em;
}

#schedule .schedule{
display: flex;
flex-wrap: wrap;
}

#schedule .schedule p{
margin: 1em auto 0;
}

#schedule .schedule > dt{
display: flex;
justify-content: center;
align-items: center;
width: 8em;
margin: 1em 0 0;
border: 1px solid;
background: none;
font-weight: bold;
}

#schedule .schedule > dd{
margin: 1em 0 0;
width: calc(100% - 9em);
}

#schedule .schedule > dd a{
font-weight: bold;
text-decoration: underline;
}

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

#schedule span.important{
padding: 0;
font-size: 1em;
color: #b40000;
font-weight: bold;
}

#schedule span.important::before{
content: none;
}

#schedule .contact{
margin: 2em 0 0;
}


/* セール */

#sale h2{
margin: 0 auto;
color: #008fab;
}

#sale h2::after{
content: none;
}

#sale h4{
width: 48.5%;
margin: 0 auto;
color: #008fab;
font-size: 20px;
}

#sale span.important{
color: #008fab;
}

#sale .term{
display: flex;
flex-wrap: wrap;
gap: 1em 0;
margin: 2em 0 0;
}

#sale .term > dt{
display: flex;
justify-content: center;
align-items: center;
width: 8em;
color: #fff;
background: #008fab;
font-weight: bold;
}

#sale .term > dd{
width: calc(100% - 9em);
}

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

#sale .sale_box ul{
width: 48.5%;
display: flex;
flex-wrap: wrap;
gap: 1rem 2%;
}

#sale .sale_box ul li{
width: 49%;
}

#sale .sale_photo{
width: 100%;
aspect-ratio: 1 / 1;
background-size: contain;
background-repeat: no-repeat;
}

#sale .sale_brand{
font-size: 13px;
margin: 0.5em 0;
}

#sale .sale_model{
font-size: 16px;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
overflow: hidden;
}

#sale .sale_price{
font-size: 20px;
font-weight: bold;
color: #c30;
text-align: right;
}

#sale .sale_price::before{
content: "税込";
font-size: 11px;
font-weight: normal;
padding-right: 0.5em;
}


/* キャンペーン */

#campaign{
margin: 60px 0 0;
padding: 60px 0 0;
border-top: 1px solid #008fab;
}

#campaign span.important{
color: #008fab;
}

#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: #008fab;
font-weight: bold;
}

#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: #008fab;
font-size: 20px;
}

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

#campaign .campaign li h4{
font-size: 16px;
}

#campaign .campaign li p{
font-size: 14px;
}


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

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

#Infomation  .rslogo{
width: 50%;
}

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

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

#Infomation .concept > div{
width: 100%;
padding: 3rem 1em;
}

#Infomation .concept .catch_copy{
font-size: 1.8rem;
}

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


/* 店舗告知（休業案内） */

#schedule .schedule_box{
margin: 3rem auto 0;
}

#schedule .schedule_box li{
width: 100%;
}

#schedule .schedule > dt,
#schedule .schedule > dd,
#schedule .contact{
font-size: 1.6rem;
}

#schedule .schedule_info{
padding: 3rem 1em;
}

#schedule .schedule_head{
font-size: 1.8rem;
}


/* セール */


#sale h4{
font-size: 1.6rem;
}

#sale .sale_box ul li{
width: 100%;
}

#sale .sale_brand{
font-size: 1.2rem;
}

#sale .sale_model{
font-size: 1.4rem;
}

#sale .sale_price{
font-size: 1.6rem;
}

#sale .sale_price::before{
font-size: 1.2rem;
}


/* キャンペーン */

#campaign{
margin: 6rem 0 0;
padding: 6rem 0 0;
}

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

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

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

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


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

/* 店舗告知（休業案内） */

#schedule .schedule_box{
margin-bottom:　2.5em;
}

#schedule .schedule > dt{
display: block;
width: 10em;
margin: 2em 0 0;
padding: 0.2em 1em;
}

#schedule .schedule > dt:first-of-type{
margin-top: 1em;
}

#schedule .schedule > dd{
width: 100%;
padding: 0;
}

#schedule .contact{
margin: 0 auto;
}


}}