/*
========================================
  ▼▼▼  共通 ▼▼▼
========================================
*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: 'Noto Sans ', sans-serif;

}
img {
    max-width: 100%;
    height: auto;
}
h3 {
    font-size: clamp(14px, 3.646vw /* viewport 768px で 28px */, 28px);
    font-weight: 600;
    line-height: 1.5;
}
@media screen and (min-width: 750px) {
    h3 {
    font-size: 16px;
}
}
.br-sp {
    display: block;
}
@media screen and (min-width:750px) {
    .br-sp {
    display: none;
}
}
/*
========================================
  ▼▼▼  店舗 ▼▼▼
========================================
*/
.store-ttl {
    font-size: clamp(35px, 9.115vw /* viewport 768px で 70px */, 70px);
    font-weight: 900;
    color: #028FDB;
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
    padding-bottom: 5px;
    border-bottom: 2px solid #DBDBDB;
}
.store-ttl._top {
    margin-top: 0;
}
.store-ttl span {
    font-family: 'Outfit', sans-serif;
    font-weight: 700;
    font-size: clamp(60px, 15.625vw /* viewport 768px で 120px */, 120px);
    font-weight: 400;
}
@media screen and (min-width:750px) {
    .store-ttl {
    font-size: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
    font-weight: 900;
    color: #028FDB;
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
    padding-bottom: 5px;
    border-bottom: 2px solid #DBDBDB;
}
.store-ttl span {
    font-family: 'Outfit', sans-serif;
    font-size: clamp(45px, 6.250vw /* viewport 1440px で 90px */, 90px);
    font-weight: 700;
}
}
.store-box {
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
}
@media screen and (min-width:750px) {
    .store-box {
    margin-top: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
}
}
.store-itemTitle {
    font-size: clamp(29px, 7.552vw /* viewport 768px で 58px */, 58px);
    font-weight: 700;
}
@media screen and (min-width:750px) {
    .store-itemTitle {
  font-size: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
}
}
.period-area {
    padding: clamp(15px, 3.906vw /* viewport 768px で 30px */, 30px) ;
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
    background-color: #E1F1FA;
}
.period-area02 {
    padding: clamp(15px, 3.906vw /* viewport 768px で 30px */, 30px) ;
    padding-bottom: 0;
}
.period-area02:last-child {
    padding-bottom: clamp(15px, 3.906vw /* viewport 768px で 30px */, 30px) ;
}
.period-areaBox {
    background-color: #E1F1FA;
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
}
@media screen and (min-width:750px) {
.period-area {
    display: flex;
    align-items: center;
    gap:  clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);;
    padding:min(1.111vw,16px) min(1.3888vw,20px);
    margin-top: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
    }
    .period-area02 {
    display: flex;
    align-items: center;
    gap:  clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
}
    .period-area._place {
    flex-direction: column;
    align-items: flex-start;
    padding:min(2.083vw,30px); 
    }

}
.period-box {
    display: flex;
    align-items:flex-start;
    flex-direction: column;
}
@media screen and (min-width:750px) { 
    .period-box {
    flex-direction: row;
    align-items: center;
    gap: clamp(10px, 1.388vw /* viewport 1440px で 20px */, 20px);
    }
}
.period-ttl {
    display: inline-block;
    font-size: clamp(14px, 3.646vw /* viewport 768px で 28px */, 28px);
    font-weight: 700;
    color:#fff;
    background-color: #028FDB;
    padding: clamp(6px, 1.563vw /* viewport 768px で 12px */, 12px) clamp(7px, 1.823vw /* viewport 768px で 14px */, 14px);
}
@media screen and (min-width:750px) { 
    .period-ttl {
        display: inline-block;
    font-size: min(1.388vw,20px) !important;
    }
}
.period-date {
    display: block;
    font-size: clamp(15px, 4.115vw /* viewport 768px で 32px */, 30px);
    font-weight: 600;
    margin-top: clamp(10px, 2.604vw /* viewport 768px で 20px */, 20px);
    line-height: 1.4;    
}
@media screen and (min-width:750px) {
    .period-date {
    font-size: clamp(12px, 1.667vw /* viewport 1440px で 24px */, 24px);
    margin-top: 0;
}
}
.period-date span {
    font-size:15px;
}
.store-img {
    margin-top:  clamp(10px, 2.604vw /* viewport 768px で 20px */, 20px);
}
@media screen and (min-width:750px) { 
    .store-img {
    margin-top: 5px;
}
.period-date span {
    font-size:  clamp(10px, 1.389vw /* viewport 1440px で 20px */, 20px);
}
}
.period-text {
    font-size: clamp(14px, 3.646vw /* viewport 768px で 28px */, 28px);
    font-weight: 400;
    margin-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
    line-height: 1.4;
}
@media screen and (min-width:750px) {
    .period-text {
    font-size: 16px;
    font-weight: 400;
    line-height: 2;
    margin-top: clamp(15px, 2.083vw /* viewport 1440px で 30px */, 30px);
}
}
.swiper-flex  {
    width: 100%;
    display: flex;
   flex-wrap: wrap;
    margin-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
    gap: clamp(25px, 6.510vw /* viewport 768px で 50px */, 50px);
}
@media screen and (min-width:750px) {
    .swiper-flex  {
    flex-wrap: nowrap;
    gap: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
    }
}
.swiper-slide {
    width: 46%;
    height: stretch;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
}
@media screen and (min-width:750px) { 
    .swiper-slide {
    width: calc(100% / 3 - min(1.3888vw,40px));
}
}
.text-box {
    padding: clamp(15px, 3.906vw /* viewport 768px で 30px */, 20px);
    border-radius: 0 0 5px 5px;
}
.text-box p {
    font-size:clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
    font-weight: 900;
    margin-top: clamp(10px, 2.604vw /* viewport 768px で 20px */, 20px);
}
.text-box p span {
    font-size: clamp(15px, 3.906vw /* viewport 768px で 30px */, 30px);
    font-weight: 400;
}
@media screen and (min-width:750px) { 
    .text-box p {
    font-size:min(1.6666vw,24px) ;
    }
    .text-box p span {
    font-size: min(1.25vw,18px);
    }
}
.period-ttl {
    font-size: clamp(16px, 4.167vw /* viewport 768px で 32px */, 32px);
    font-weight: 700;
}
.place-ttl {
    font-size: clamp(14px, 3.125vw /* viewport 768px で 24px */, 28px);
    font-weight: 700;
    margin-top: clamp(10px, 2.604vw /* viewport 768px で 20px */, 20px);
    line-height: 1.4;
}
@media screen and (min-width:750px) { 
    .place-ttl {
        font-size: min(1.666vw,24px);
    margin-top: 0;
    }
}
.place-imgFlex {
    display: flex;
    flex-direction: column;
    gap: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
}
@media screen and (min-width:750px) { 
    .place-imgFlex {
    flex-direction: row;
    gap: clamp(20px, 2.778vw /* viewport 1440px で 40px */, 40px);
    }
} 
/*
========================================
  ▼▼▼  店舗 2つ目 ▼▼▼
========================================
*/
.sec {
        padding: 40px 4% 100px 4%;
}
@media screen and (min-width:750px) { 
    .sec {
       padding: 40px 4% clamp(50px, 13.021vw /* viewport 768px で 100px */, 100px);
}
}
.sec:nth-child(odd) {
      padding: 40px 4% 100px;
    background-color: #EDEDED;
}
@media screen and (min-width:750px) { 
    .sec:nth-child(odd) {
        margin-top: 0;
    }
}
.period-area._color {
    background-color: #D5D5D5;
}
.period-ttl._color {
    color: #222;
    background-color: #fff;
}
/*
========================================
  ▼▼▼  非表示 ▼▼▼
========================================
*/
body.is-popupstore .useful {
  display: none !important;
}
.ticketBtn {
  display: none !important;
}


/*
========================================
  ▼▼▼  pop up wagon  ▼▼▼. css
========================================
*/
.place-img01 {
    width: 100%;
    margin-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
}
@media screen and (min-width:750px) {
    .place-img01 {
    width: 65%;
    margin: 0 auto;
}
}
.store-bg {
    background-color: #fff !important;
}
.store-img a:hover img {
  opacity: 0.7;
  transition: opacity 0.3s;
}
.scrooll-marginTop {
    scroll-margin-top: 80px; /* スクロール位置の上部に余白を追加 */
}
.swiper-text {
    font-size:16px;
    font-weight: 600;
    margin-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
    line-height: 1.4;
    text-align: center;
}
@media screen and (min-width:750px) {
    .swiper-text {
    font-size:  clamp(14px, 3.646vw /* viewport 768px で 28px */, 28px);
    line-height: 2;
    margin-top: clamp(15px, 2.083vw /* viewport 1440px で 30px */, 30px);
}
}
/*
========================================
  ▼▼▼  section-item  ▼▼▼. css
========================================
*/
.section-item {
        margin: auto;
        max-width: 1000px;
}
.section-item:nth-child(odd) {
    margin-top: clamp(30px, 7.813vw /* viewport 768px で 60px */, 60px);
    
}

.place-img {
    width: 100%;
    margin: 0 auto;
    margin-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
}
@media screen and (min-width:750px) {
    .place-img {
    width: 65%;
    margin-top: 0;
}
}
._border-top {
    border-top: 2px solid #DBDBDB;
    padding-top: clamp(20px, 5.208vw /* viewport 768px で 40px */, 40px);
}