.breadcrumb-list {
        font-size: 100%;
        text-align: center;
        margin-top: 16px;
        font-family: 'Noto Sans Japanese';
    }

    .breadcrumb-list li {
        background: url('/wp-content/themes/whotels/common/img/w-party/hospitality/breadcrumb_arrow.png') no-repeat 0 50%;
        background-size: 9px 14px;
        padding-left: 38px;
        margin: 0 14px;
        display: inline-block;
    }

    .breadcrumb-list li:first-child {
        background: none;
        padding-left: 0;
    }

    .breadcrumb-list li.current {
        font-weight: bold;
    }

    .breadcrumb-list a {
        color: #000;
    }

    .prize-headding {
        text-align: center;
        margin: 80px auto 30px;
    }

    .prize-headding img {
        width: 80px;
    }

    .prize-headding h2 {
        background-color: initial;
        color: #000;
        padding: 0;
        margin: 50px 0 24px;
        font-size: 50px;
        letter-spacing: 8px;
    }

    .prize-flow {
        background-color: #f0f0f0;
        padding: 5% 0;
    }

    .link-text {
        text-align: end;
        font-size: 10px;
        display: block;
        max-width: 980px;
        margin: 20px auto 0;
    }

    .prize-h3 {
        margin-bottom: 18px;
        color: #000;
        border-bottom: none;
        text-align: center;
        font-size: 24px;
    }

    .flex-gruop {
        display: flex;
        gap: 74px;
        justify-content: center;
        max-width: 1000px;
        margin: 0 auto;
    }

    .item {
        display: flex;
        flex-direction: column-reverse;
        position: relative;
        height: 330px;
    }

    .item .text-area {
        background-color: #fff;
        padding: 12% 10% 3%;
        border-radius: 18px;
    }

    .item .text-area h4 {
        text-align: center;
        font-size: 20px;
        color: #988454;
        margin-bottom: 1em;
    }

    .item .text-area p {
        font-size: 14px;
    }

    .step-icon {
        color: #988454;
        font-size: 24px;
        text-align: center;
        line-height: 1.1;
        position: absolute;
        top: 4px;
        left: 5%;
    }

    .step-icon span {
        display: block;
    }

    .step-icon .step-icon--fm {
        font-size: 14px;
    }

    .step-icon .step-icon--fs {
        font-size: 10px;
    }

    .icon-img {
        width: 100px;
        position: absolute;
        top: 33%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .prize-point {
        max-width: 1200px;
        margin: 90px auto 250px;
    }

    .prize-point h2 {
        margin-bottom: 42px;
    }

    .prize-point .flex-gruop {
        gap: 34px;
    }

    .prize-point img {
        width: 25%;
    }

    /* 景品グリッド CSS - Muuri版（改良版） */

    * {
        margin: 0;
        padding: 0;
    }

    .prize-grid-container {
        width: 100%;
        padding: 10px;
        box-sizing: border-box;
        overflow: hidden;
    }

    .prize-header {
        text-align: center;
        margin-bottom: 30px;
        color: white;
    }

    .prize-header h1 {
        font-size: 2.5rem;
        margin-bottom: 10px;
        text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
    }

    .prize-controls {
        display: flex;
        justify-content: center;
        margin-bottom: 30px;
    }

    .filter-btn {
        padding: 1px 18px;
        border: none;
        border-radius: 25px;
        cursor: pointer;
        transition: all 0.3 s ease;
        background: #fff;
        color: #988454;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
        white-space: nowrap;
        border: solid 1.5px #988454;
        margin: 4px;
    }

    .filter-btn--all {
        margin-bottom: 12px;
    }

    .filter-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
        background-color: #988454 !important;
    }

    .filter-btn.active {
        background: #988454;
        color: #fff;
        font-weight: bold;
    }


    /* Muuriグリッドレイアウト */
    .prize-grid {
        max-width: 1200px;
        margin: 0 auto 120px;
        position: relative;
    }

    .prize-item {
        position: absolute;
        margin: 10px;
        background: white;
        border-radius: 15px;
        overflow: hidden;
        box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1);
        transition: all 0.3s ease;
        cursor: pointer;
    }

    /* アイテムサイズの定義 */
    .prize-item.size-small {
        width: 180px;
        height: 180px;
    }

    .prize-item.size-medium {
        width: 200px;
        height: 280px;
    }

    .prize-item.size-large {
        width: 260px;
        height: 260px;
    }

    .prize-item:hover {
        transform: translateY(-5px) scale(1.02);
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
    }

    /* サイズ別の画像とコンテンツの高さ調整 */
    .prize-item.size-small .item-image {
        height: 100%;
    }

    .prize-item.size-medium .item-image {
        height: 65%;
    }

    .prize-item.size-large .item-image {
        height: 70%;
    }

    .item-image {
        width: 100%;
        position: relative;
        overflow: hidden;
        background: #f8f9fa;
    }

    .item-category-overlay {
        position: absolute;
        top: 8px;
        left: 8px;
        padding: 6px 12px;
        background: rgba(0, 0, 0, 0.7);
        color: white;
        border-radius: 15px;
        font-size: 0.75rem;
        font-weight: bold;
        z-index: 3;
        backdrop-filter: blur(5px);
    }

    .item-category-overlay.popular {
        background: linear-gradient(45deg, #ff6b6b, #feca57);
    }

    .item-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.3s ease;
    }

    .prize-item:hover .item-image img {
        transform: scale(1.1);
    }

    .item-image::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient(45deg,
                transparent 30%,
                rgba(255, 255, 255, 0.3) 50%,
                transparent 70%);
        transform: translateX(-100%);
        transition: transform 0.6s ease;
        z-index: 2;
    }

    .prize-item:hover .item-image::before {
        transform: translateX(100%);
    }

    .item-content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    /* サイズ別のコンテンツ調整 */
    .prize-item.size-small .item-content {
        display: none;
    }

    .prize-item.size-medium .item-content {
        height: 35%;
        padding: 15px;
    }

    .prize-item.size-large .item-content {
        height: 30%;
        padding: 16px;
    }

    .item-title {
        font-weight: bold;
        color: #333;
        line-height: 1.2;
    }

    .prize-item.size-medium .item-title {
        font-size: 0.9rem;
        margin-bottom: 15px;
        line-height: 1.3;
    }

    .prize-item.size-large .item-title {
        font-size: 0.9rem;
        margin-bottom: 15px;
    }

    .item-points {
        text-align: right;
        font-weight: bold;
        color: #ff6b6b;
        margin-top: auto;
    }

    .prize-item.size-medium .item-points {
        font-size: 1.2rem;
    }

    .prize-item.size-large .item-points {
        font-size: 1.3rem;
    }

    /* カテゴリーオーバーレイのサイズ調整 */
    .prize-item.size-small .item-category-overlay {
        font-size: 0.6rem;
        padding: 4px 8px;
    }

    .prize-item.size-medium .item-category-overlay {
        font-size: 0.7rem;
        padding: 6px 10px;
    }

    .prize-item.size-large .item-category-overlay {
        font-size: 0.8rem;
        padding: 8px 12px;
    }

    .item-badge {
        position: absolute;
        top: 10px;
        right: 10px;
        background: rgba(0, 0, 0, 0.7);
        color: white;
        padding: 5px 10px;
        border-radius: 15px;
        font-size: 0.8rem;
        font-weight: bold;
        z-index: 3;
    }

    .item-badge.popular-badge {
        background: linear-gradient(45deg, #ff6b6b, #feca57);
        animation: pulse 2s infinite;
    }


    @keyframes pulse {
        0% {
            transform: scale(1);
        }

        50% {
            transform: scale(1.05);
        }

        100% {
            transform: scale(1);
        }
    }

    @keyframes sparkle {

        0%,
        100% {
            transform: scale(1) rotate(0deg);
        }

        50% {
            transform: scale(1.2) rotate(10deg);
        }
    }

    .fade-in {
        animation: fadeIn 0.5s ease-in;
    }

    @keyframes fadeIn {
        from {
            opacity: 0;
            transform: translateY(20px);
        }

        to {
            opacity: 1;
            transform: translateY(0);
        }
    }

    /* モバイル対応 */
    @media (max-width: 768px) {

        #categoryFilters {
            padding: 0 8px;
            text-align: center;
        }

        .prize-flow {
            padding: 15% 0;
        }

        .link-text {
            padding: 0 24px;
        }

        .prize-h3 {
            font-size: 18px;
            margin-bottom: 32px;
        }

        .prize-point {
            margin: 13% auto 170px;
        }

        .prize-flow .flex-gruop .item {
            max-width: 272px;
        }

        .prize-headding h2 {
            font-size: 32px;
        }

        .flex-gruop {
            flex-wrap: wrap;
            padding: 0 8px;
        }

        .prize-point .flex-gruop {
            gap: 4px;
        }

        .prize-point img {
            width: calc(50% - 2px);
        }


        .prize-grid {
            margin: 8px auto 68px;
        }

        /* 全てsize-mediumで統一（横幅50%） */
        .prize-item.size-small,
        .prize-item.size-medium,
        .prize-item.size-large {
            width: calc(50% - 2px);
            height: 200px;
            margin: 1px;
        }

        .prize-grid {
            padding: 0 5px;
        }

        .prize-header h1 {
            font-size: 2rem;
        }

        .prize-controls {
            padding: 0 8px;
            flex-direction: column;
            justify-content: center;
            align-items: center;
        }

        /* モバイルでのコンテンツ調整（全サイズ統一） */
        .prize-item.size-small .item-image,
        .prize-item.size-medium .item-image,
        .prize-item.size-large .item-image {
            height: 74%;
        }

        .prize-item.size-small .item-content,
        .prize-item.size-medium .item-content,
        .prize-item.size-large .item-content {
            height: 40%;
            padding: 8px;
            display: flex;
            /* size-smallもコンテンツを表示 */
        }

        /* モバイルでのフォントサイズ調整（全サイズ統一） */
        .prize-item.size-small .item-title,
        .prize-item.size-medium .item-title,
        .prize-item.size-large .item-title {
            font-size: 0.75rem;
            margin-bottom: 6px;
        }

        .prize-item.size-small .item-points,
        .prize-item.size-medium .item-points,
        .prize-item.size-large .item-points {
            font-size: 0.9rem;
        }

        /* カテゴリーオーバーレイのモバイル調整（全サイズ統一） */
        .prize-item.size-small .item-category-overlay,
        .prize-item.size-medium .item-category-overlay,
        .prize-item.size-large .item-category-overlay {
            font-size: 0.6rem;
            padding: 4px 6px;
        }
    }

    /* モーダルスタイル */
    .prize-modal {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 9999;
        opacity: 0;
        visibility: hidden;
        transition: all 0.3s ease;
    }

    .prize-modal.show {
        opacity: 1;
        visibility: visible;
    }

    .modal-backdrop {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.8);
    }

    .modal-content {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        background: white;
        border-radius: 10px;
        max-width: 90vw;
        max-height: 90vh;
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    }

    .modal-close {
        position: absolute;
        top: 10px;
        right: 15px;
        background: none;
        border: none;
        font-size: 30px;
        color: #999;
        cursor: pointer;
        z-index: 10;
        transition: color 0.2s ease;
    }

    .modal-close:hover {
        color: #333;
    }

    .modal-image img {
        width: 100%;
        max-width: 600px;
        height: auto;
        display: block;
    }

    .modal-info {
        padding: 20px;
        text-align: center;
    }

    .modal-info h3 {
        margin: 0 0 10px 0;
        font-size: 1.5em;
        color: #333;
    }

    .modal-info p {
        margin: 0;
        color: #666;
        font-size: 1.1em;
    }

    ;