/* SHOP　----------------------------------------------------------------*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    background:#fff;
    font-family:
        "Yu Gothic",
        "Hiragino Kaku Gothic ProN",
        sans-serif;
    color:#111;
    line-height:1.6;
}

a{
    color:#0044cc;
    text-decoration:none;
}

a:hover{
    text-decoration:underline;
}

.wrapper{
    max-width:900px;
    margin:0 auto;
    background:#fff;
    border-top:5px solid #eee;
    padding:20px;
}

/* ------------------------
   HEADER
------------------------ */

.logo{
    width:120px;
    display:block;
}

.store-title{
    font-size:clamp(28px, 4vw, 36px);
    font-weight:bold;
    margin:20px 0;
}

/* ------------------------
   MAIN CONTENT
------------------------ */

.main-box{
    display:flex;
    gap:20px;
    border:5px solid #d6d6d6;
    background:#efefef;
    padding:15px;
}

/* ← これを追加 */
align-items:flex-start;
    .left-area{
    flex:1;
}

.left-area{
    flex:1;
    width:100%;
    min-width:0;
}

.store-image{
    width:100%;
    display:block;
}

table{
    width:100%;
    border-collapse:collapse;
    margin-top:15px;
    background:#fff;

    /* ← 追加 */
    table-layout:fixed;

}

th,
td{
    border-bottom:1px solid #ddd;
    padding:14px 10px;
    vertical-align:top;
}

th{
    width:120px;
    text-align:left;
    font-weight:bold;
    background:#fafafa;
}

td{
    width:auto;

    /* ← 長文でも幅いっぱい使う */
    word-break:break-word;
}

.right-area{
    width:400px;
    flex-shrink:0;
}

.section-title{
    background:#008e4a;
    color:#fff;
    text-align:center;
    font-size:28px;
    font-weight:bold;
    padding:10px;
    margin-bottom:15px;
}

.flyer-box{
    max-witdh:370px;
    width:100%;
    margin:0 auto;
    background:#8a5b2d;
    padding:15px;
    color:#fff;
    text-align:center;
}

.flyer-box iframe{
    width:100%;
    height:450px;
    border:none;
}

.flyer-image{
    width:100%;
    border:4px solid #fff;
    display:block;
}

.flyer-title{
    font-size:28px;
    font-weight:bold;
    line-height:1.5;
    margin:15px 0 10px;
}
.flyer-title span{
    font-size:20px;
}

.flyer-date{
    font-size:20px;
}

/* ------------------------
   NOTICE
------------------------ */

.notice-section{
    margin-top:25px;
}

.notice-box{
    background:#fff;
    border:5px solid #ddd;
    margin-bottom:12px;
}

.notice-date{
    font-size:18px;
    margin-bottom:10px;
}

.notice-text{
    font-size:30px;
    font-weight:bold;
    line-height:1.5;
}

/* ------------------------
   BUTTON
------------------------ */

.news-button{
    display:inline-block;
    transition:0.3s;
    padding:18px;
}

.news-button:hover{
    background:#ffff00;
/*    background:#fee5e5; */
    text-decoration: none;
}


/* ------------------------
   RESPONSIVE
------------------------ */

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

    .wrapper{
        padding:15px;
    }

    .main-box{
        flex-direction:column;
    }

    .right-area{
        width:100%;
    }

    .section-title{
        font-size:24px;
    }

    .flyer-title{
        font-size:22px;
    }
    .flyer-title span{
        font-size:20px;
    }

    .flyer-date{
        font-size:20px;
    }

    .notice-text{
        font-size:22px;
    }

    th{
        width:90px;
        font-size:20px;
    }

    td{
        font-size:20px;
    }
}

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

    .wrapper{
        padding:10px;
    }

    .store-title{
        margin:15px 0;
    }

    .main-box{
        padding:10px;
    }

    .section-title{
        font-size:20px;
        padding:8px;
    }

    .flyer-title{
        font-size:20px;
    }
    .flyer-title span{
        font-size:18px;
    }

    .flyer-date{
        font-size:16px;
    }

    .notice-date{
        font-size:15px;
    }

    .notice-text{
        font-size:18px;
    }

    table,
    tbody,
    tr,
    th,
    td{
        display:block;
        width:100%;
    }

    th{
        border-bottom:none;
        padding-bottom:5px;
        background:none;
    }

    td{
        padding-top:0;
    }
}
