/* 東口店　キャンペーン */

.campaign-box {
    width: 80%;
    margin: 20px auto; 
    padding: 10px 15px;
    
    display: flex;
    flex-direction: column;
    align-items: center; /* 基本は中央寄せ */
    gap: 2px; /* 縦の間隔をさらに詰めました */

    border: 3px solid #ff4500;
    background-color: #fff9f0;
    border-radius: 10px;
    font-weight: bold;
}

/* 【追加】1段目だけを左に寄せる設定 */
.campaign-title {
    align-self: flex-start; /* これでこの要素だけ左寄せになります */
    padding-left: 10px;      /* 左端からの微調整 */
    font-size: 1.2em;
    color: #666;             /* ラベルっぽく少し色を落ち着かせる場合 */
}

/* 2段目以降の設定 */
.campaign-title2 {
    color: #d32f2f;
    font-size: 1.2em;
}

.campaign-box p {
    margin: 0;
    padding: 0;
    line-height: 1.2;
}

.campaign-price {
    font-size: 1.3em;
    color: #e60000;
}


/* ポイントカードの表示 */

/* 画像を囲うボックスの調整 */
.campaign-image {
    text-align: center; /* 画像を中央に */
    margin: 10px 0;    /* 前後の文章との間に少し隙間を作る */
}

/* 画像自体のサイズ調整 */
.campaign-image img {
    max-width: 70%;    /* 親要素（枠）からはみ出さない */
    height: auto;       /* 比率を維持 */
    border-radius: 5px; /* 角を少し丸くすると馴染みが良い */
    box-shadow: 0 2px 5px rgba(0,0,0,0.1); /* 軽い影をつける */
}

/* ゴールデンウィークの料金　表示 */

.campaign-box img {
    max-width: 100%;
    height: auto;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2); /* 右方向 下方向 ぼかし 強さ */
}