img {
    padding: 0px;
    margin: 0px;
    max-width: 100%;
}
@media (min-width: 1300px) {
    img {
        width: 100%; /* 幅を100%に設定 */
        padding: 0px;
        margin: 0px;
    }
}

body {
    margin-top: 90px; /* ヘッダーの高さに合わせて調整 */
    text-align: center; /* 中央に配置 */
}
@media (max-width: 767px) {
    body {
        margin-top: 70px; /* ヘッダーの高さに合わせて調整 */
    }
}
/* コンテンツエリア */
.content-wrapper1 {
    background-image: url(../img/hanabi.png);
    background-color: #fff5bd;
    background-size: 1200px 1000px; /* 花火のサイズ */
    background-repeat: repeat; /* 繰り返し*/
    background-position: top center; /* 上中央に配置 */
}

.content-wrapper2 {
    background-image: url(../img/kamihubuki.png);
    background-color: #ffd35c;
    background-repeat: no-repeat; /* 繰り返さない（上に1枚だけ） */
    background-position: top center; /* 上中央に配置 */
    background-size: contain; /* 画面幅に応じて自動調整 */
}

.content-wrapper3 {
    background-image: url(../img/kamihubuki.png);
    background-color: #ffb900;
    background-repeat: no-repeat; /* 繰り返さない（上に1枚だけ） */
    background-position: top center; /* 上中央に配置 */
    background-size: contain; /* 画面幅に応じて自動調整 */
}

@media (max-width: 767px) {
    .content-wrapper1 {
        background-size: 800px 600px; /* 花火のサイズ */
    }
}

.nav-icon {
    width: 20px; /* お好みの幅に変更 */
    height: auto; /* 高さは自動でアスペクト比を維持 */
}
.nav-item {
    font-weight: bold;
    font-size: 1.4vw;
    display: flex;
    align-items: center;
}
.nav-lang {
    font-weight: bold;
    font-size: 1.6vw;
}
.nav-lang a {
    margin: 0 2px;
    text-decoration: none;
}
@media (max-width: 767px) {
    .nav-lang,
    .nav-lang a {
        font-size: 20px;
    }
}

/* ナビバーのロゴ */
.logo_pic {
    width: 260px;
}

/* スマホ用調整 */
@media (max-width: 767px) {
    .logo_pic {
        width: 180px;
    }
}
.headimage-wrapper {
    position: relative;
    display: inline-block;
    vertical-align: bottom; /* これで画像下の余白を防げます */
    width: 100%;
}
/* メイン画像 */
.headimage {
    width: 100%;
    display: block;
}

.overlay-content {
    position: absolute;
    top: 60%;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    z-index: 2;
    padding: 1em;
    border-radius: 10px;
    width: 100%; /* ← 追加！親幅を明示的に広げる */
    max-width: 800px; /* ← 必要に応じて最大幅を設定 */
}

/* 以下スタート */
.highlight-black {
    font-weight: bold;
    color: #000;
    font-size: 18px;
}

.highlight-red {
    color: #e60039;
    font-weight: bold;
    font-size: 18px;
}
.special-title {
    font-family: "Kosugi Maru", sans-serif;
    font-size: 2rem;
    font-weight: bold;
    color: #0050c8;
    display: inline-block;
    margin-bottom: 1rem;
}
.highlight-pink {
    color: #e91e63;
    font-weight: bold;
}

.highlight-black {
    color: #000;
    font-weight: bold;
}

.doll_image {
    width: 100%;
}
.img-naritachi {
    width: 75%;
}
.week {
    width: 75%;
    margin: 0 auto; /* 中央揃え */
}

@media (max-width: 767px) {
    .doll_image {
        width: 100%; /* スマホは幅を少し小さく */
    }
    .img-naritachi {
        width: 90%;
    }
    .week {
        width: 90%;
    }
}

/* 事務局 */
.jimukyoku {
    width: 40%;
    text-align: center;
    margin: 0 auto;
    transition: transform 0.3s;
}
.jimukyoku:hover {
    transform: scale(1.05); /* クリック時浮く */
}

.kumiai {
    width: 87%;
    text-align: center;
    margin: 5vh auto;
}

/* スマホ画面 */
@media screen and (max-width: 767px) {
    /* 事務局 */
    .jimukyoku {
        width: 65%;
        text-align: center;
        margin: 10px auto;
    }
}
/* サイドメニュー（ハンバーガボタン） ↓*/
.side-menu {
    position: fixed;
    top: 0;
    right: -270px;
    width: 270px; /* メニュー横調整 */
    height: 100%; /* メニュー高さ調整 */
    background-color: #fff;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
    transition: right 0.3s ease;
    z-index: 100; /* 重ね画像や他の要素よりも前面に表示されるように設定 */
}
.side-menu.show {
    right: 0;
    padding-top: 12vh; /* 上に50vhを追加 */
}
.side-menu ul {
    padding: 1rem;
    list-style: none;
}
.side-menu li {
    margin: 0.3rem 0; /* 上下 文字間隔 */
}
.side-menu a {
    font-size: 1.2rem; /* 文字サイズを調整 */
    color: #333;
}

/* リンクにホバーしたときのスタイル */
.side-menu a {
    text-decoration: none; /* デフォルトの下線を取り除く */
    color: #333; /* リンクのデフォルトカラー */
    position: relative; /* 下線のための相対位置指定 */
    display: inline-block; /* 下線を文字だけに合わせるため */
}

.side-menu a:hover {
    color: #007bff; /* ホバー時のテキストカラー */
}

.side-menu a:hover::after {
    content: ""; /* 擬似要素の内容は空にする */
    /*position: absolute; /* 絶対位置で下線を表示 */
    left: 0;
    bottom: 10px; /* テキストの下に下線を表示する */
    width: 100%; /* テキストの幅に合わせる */
    border-bottom: 1.2px solid #007bff; /* 下線のスタイル */
}

.navbar-toggler {
    position: relative; /* トグルボタンを基準として位置を指定するために relative を設定 */
    border: none; /* ボタンの枠線を削除 */
    background: none; /* ボタンの背景を削除 */
    font-size: 1.5rem; /* ボタン内のフォントサイズを 1.5rem に設定 */
}

.navbar-toggler:focus {
    outline: none; /* デフォルトの外枠を削除 */
    box-shadow: 0 0 0 0px black; /* クリックしたときの外枠の太さと色を設定 */
}

.navbar-toggler .fa-bars,
.navbar-toggler .fa-times {
    color: black; /* アイコンの色を黒に設定 */
    font-size: 1.5rem; /* アイコンのサイズを 1.5rem に設定 */
}

/* 最初はハンバーガーアイコンを表示 */
.navbar-toggler .fa-bars {
    display: block; /* fa-bars アイコンを表示 */
}

.navbar-toggler .fa-times {
    display: none; /* fa-times アイコンを非表示 */
}

/* トグルが閉じている状態ではハンバーガーアイコンを表示 */
.navbar-toggler.collapsed .fa-bars {
    display: block; /* .collapsed クラスが付いているときに fa-bars アイコンを表示 */
}

/* トグルが開いている状態ではハンバーガーアイコンを非表示 */
.navbar-toggler:not(.collapsed) .fa-bars {
    display: none; /* .collapsed クラスがないときに fa-bars アイコンを非表示 */
}

/* トグルが開いている状態では×アイコンを表示 */
.navbar-toggler:not(.collapsed) .fa-times {
    display: block; /* .collapsed クラスがないときに fa-times アイコンを表示 */
}

/* トグルが閉じている状態では×アイコンを非表示 */
.navbar-toggler.collapsed .fa-times {
    display: none; /* .collapsed クラスが付いているときに fa-times アイコンを非表示 */
}
/* 大きな画面ではサイドメニューを表示しない */
@media (min-width: 768px) {
    .side-menu {
        display: none;
    }
}
/* サイドメニュー（ハンバーガボタン） ↑*/

/* 当てようCP 間隔調整 ↓*/
.follow_cp,
.reshito_cp {
    width: 40%;
    display: block;
    padding: 0;
}

/* 左画像は右寄せ */
.follow_cp {
    margin-left: auto;
    margin-right: 0;
}

/* 右画像は左寄せ */
.reshito_cp {
    margin-left: 0;
    margin-right: auto;
}
/* スマホ画面は中央寄せに変更 */
@media (max-width: 767px) {
    .follow_cp,
    .reshito_cp {
        margin-left: auto !important;
        margin-right: auto !important;
        display: block;
    }
}
/* 当てようCP 間隔調整 ↑*/

/* 上2つのボタンのコンテナー
イベント登録 小売店の皆さまへのボタン↓ */
.top-buttons {
    position: fixed;
    top: 80px;
    right: 20px;
    z-index: 10000;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.top-buttons a {
    display: block;
    width: 14vw; /* 幅を統一 */
    height: auto;
}

.top-buttons img {
    width: 100%;
    height: auto;
    display: block;
}
.top-buttons a:hover {
    transform: scale(1.05); /* クリック時浮く */
}
/* スマホ用 非表示 */
@media (max-width: 767px) {
    .top-buttons {
        display: none;
    }
}
/* 上2つのボタンのコンテナー
イベント登録 小売店の皆さまへのボタン↑ */

/* 日本酒の日とは？ボタン 茶 ↓*/
.sake-button {
    background-color: #cf8a00; /* 濃いオレンジ色 */
    color: white;
    padding: 10px 30px;
    border: none;
    border-radius: 999px; /* 丸みを強調 */
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    display: inline-block;
    text-decoration: none; /* ← 下線を消す */
    text-align: center; /* 中央に配置 */
}

.sake-button:hover {
    background-color: #a86e00; /* ホバー時に少し濃く */
}
/* 日本酒の日とは？ボタン 茶 ↑*/

/* 日本酒で乾杯2025枠 ↓*/
.top-image {
    display: block;
    width: 100%;
    max-width: 75%;
    margin: 0 auto;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}

.wrapper {
    max-width: 75%;
    margin: 0 auto 30px auto;
    background-color: #fff;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    overflow: hidden;
}
@media (max-width: 767px) {
    .top-image,
    .wrapper {
        max-width: 90%;
    }
}

.top-banner {
    background-color: #d80000;
    color: white;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 1.6;
    padding: 20px 10px;
}

.content {
    padding: 20px 30px 30px 30px;
}

.red-text {
    color: #d80000;
    font-weight: bold;
    font-size: 2.2vw;
    line-height: 1.8;
    text-align: center;
    margin-bottom: 20px;
}

.black-text {
    color: #000;
    font-size: 2.2vw;
    line-height: 1.8;
    text-align: center;
    margin-bottom: 30px;
    margin: 0 auto; /* 中央揃え */
}

.schedule-box {
    background-color: #fff8e8;
    border-radius: 20px;
    padding: 50px;
}

.schedule-title {
    font-weight: bold;
    text-align: center;
    font-size: 2.5vw;
    margin-bottom: 20px;
}

.schedule-item {
    display: flex;
    align-items: center;
    font-size: 2vw;
    margin: 20px 0;
}

.time {
    background-color: orange;
    color: white;
    font-weight: bold;
    border-radius: 50px;
    padding: 4px 10px;
    min-width: 22%;
    text-align: center;
    margin-right: 18px;
}

.note {
    font-size: 1.8vw;
    color: #666;
    margin-top: 15px;
}

@media (max-width: 767px) {
    .red-text {
        font-size: 4vw;
    }

    .black-text {
        font-size: 4vw;
    }
    .schedule-title {
        font-size: 4.5vw;
    }
    .schedule-item {
        font-size: 3.8vw;
    }
    .schedule-box {
        padding: 10px;
    }
    .note {
        font-size: 3.2vw;
    }
    .time {
        min-width: 28%;
    }
    .content {
        padding: 20px 20px 20px 20px;
    }
}
/* 日本酒で乾杯2025枠 ↑*/

.title_21 {
    width: 68%;
    margin: 0 auto; /* 中央揃え */
}

@media (max-width: 767px) {
    .title_21 {
        width: 60%;
    }
}
.sake_origin {
    font-size: 1.8vw;
    line-height: 1.8;
    width: 75%;
}
.sake_event {
    font-size: 1.8vw;
    line-height: 1.8;
    margin: 0 auto; /* 中央揃え */
    width: 75%;
}
.sake-text1 {
    font-size: 2vw;
    line-height: 1.8;
    color: rgb(201, 29, 29); /* 赤系文字色 */
    font-weight: bold;
    margin: 0 auto; /* 中央揃え */
    width: 75%;
}

.sake-text2 {
    font-size: 1.8vw;
    line-height: 1.8;
    margin: 0 auto; /* 中央揃え */
    width: 75%;
}
@media (max-width: 767px) {
    .sake_origin {
        font-size: 3.6vw;
        width: 90%;
    }
    .sake_event {
        font-size: 3.6vw;
        width: 90%;
    }
    .sake-text1 {
        font-size: 4vw;
        width: 90%;
    }
    .sake-text2 {
        font-size: 3.6vw;
        width: 90%;
    }
}