.danji-pd-container {
    position: relative;
    --head-color: #FFF;
    --head-bg: transparent;
    --body-color-default: #222222;
    --body-color-primary: #737373;
    --body-color-secondary: #737373;
    --body-bg: #ffffff;
    --background-bg: #f7f8fa;
    --foot-color: #052841;
    --foot-bg: #ecff01;
    width: min(96%,880px);
    margin-inline:auto;overflow: hidden
}

@media screen and (max-width: 767px) {
    .danji-pd-container {
        background-size:12vw
    }
}

.danji-pd-head {
    color: var(--head-color);
    background: var(--head-bg);
    font-size: 2.5rem;
    border-radius: 12px 12px 0 0;
    background: url("danji-head-bg.png?t=1765953687149") bottom/100% no-repeat;
    height: 100%;
    aspect-ratio: 1220/100;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.danji-pd-head b {
    line-height: 1
}

.danji-pd-body {
    background: var(--body-bg);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    text-align: left;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 1.75rem;
    padding: 1.75rem 1.45rem 1.45rem
}

.danji-pd-body .pd-img {
    -ms-flex-preferred-size: 40%;
    flex-basis: 40%;
    -webkit-transition: -webkit-filter .3s ease-in-out;
    transition: -webkit-filter .3s ease-in-out;
    transition: filter .3s ease-in-out;
    transition: filter .3s ease-in-out, -webkit-filter .3s ease-in-out;
    position: relative
}

.danji-pd-body .pd-img:hover {
    -webkit-filter: brightness(110%);
    filter: brightness(110%)
}

.danji-pd-body .pd-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-preferred-size: 60%;
    flex-basis: 60%
}

.danji-pd-body .pd-info-rest {
    color: var(--body-color-secondary);
    font-size: 1.5rem;
    font-weight: bold
}

.danji-pd-body .pd-info-notice {
    color: var(--body-color-secondary);
    font-size: 1.5rem
}

.danji-pd-body .pd-info-brand {
    color: var(--body-color-default);
    font-weight: bolder;
    font-size: 2.5rem;
    letter-spacing: -0.025em;
    margin-left: -0.4em;
    margin-left: -0.35em
}

.danji-pd-body .pd-info-name {
    color: var(--body-color-default);
    font-weight: bolder;
    font-size: 2.5rem;
    letter-spacing: -0.025em
}

.danji-pd-body .pd-info-amount {
    color: var(--body-color-primary);
    font-size: 2rem
}

.danji-pd-body .pd-info-btn {
    width: min(75%,289px);
    -webkit-transition: -webkit-filter .3s ease-in-out;
    transition: -webkit-filter .3s ease-in-out;
    transition: filter .3s ease-in-out;
    transition: filter .3s ease-in-out, -webkit-filter .3s ease-in-out
}

.danji-pd-body .pd-info-btn img {
    width: 100%;
    height: auto
}

.danji-pd-body .pd-info-btn:hover {
    -webkit-filter: brightness(110%);
    filter: brightness(110%)
}

.danji-pd-foot {
    color: var(--foot-color);
    background: var(--foot-bg);
    font-size: 1.5rem;
    padding-block:.6rem}

@media screen and (min-width: 768px) {
    .danji-pd-body .pd-info-btn {
        margin-bottom:2rem
    }

    .danji-pd-container {
        border-radius: 12px;
        padding: 0px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }
}

@media screen and (max-width: 767px) {
    .danji-pd-container {
        border-radius:12px
    }

    .danji-pd-head {
        font-size: 1.15rem
    }

    .danji-pd-body {
        gap: .6rem;
        padding: .72rem
    }

    .danji-pd-body .pd-img {
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%;
        -webkit-transition: -webkit-filter .3s ease-in-out;
        transition: -webkit-filter .3s ease-in-out;
        transition: filter .3s ease-in-out;
        transition: filter .3s ease-in-out, -webkit-filter .3s ease-in-out
    }

    .danji-pd-body .pd-info {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-preferred-size: 50%;
        flex-basis: 50%
    }

    .danji-pd-body .pd-info-brand {
        color: var(--body-color-default);
        font-weight: bolder;
        font-size: 1.15rem;
        margin-left: -0.4em
    }

    .danji-pd-body .pd-info-name {
        color: var(--body-color-default);
        font-weight: bolder;
        font-size: 1.15rem
    }

    .danji-pd-body .pd-info-amount {
        color: var(--body-color-primary);
        font-size: 1rem
    }

    .danji-pd-body .pd-info-btn {
        width: min(77%,280px);
        -webkit-transition: -webkit-filter .3s ease-in-out;
        transition: -webkit-filter .3s ease-in-out;
        transition: filter .3s ease-in-out;
        transition: filter .3s ease-in-out, -webkit-filter .3s ease-in-out
    }

    .danji-pd-body .pd-info-btn:hover {
        -webkit-filter: brightness(110%);
        filter: brightness(110%)
    }

    .danji-pd-body .pd-info-rest {
        font-weight: bold;
        font-size: .75rem
    }

    .danji-pd-body .pd-info-notice {
        font-size: .75rem
    }

    .danji-pd-foot {
        color: var(--foot-color);
        background: var(--foot-bg);
        font-size: .75rem;
        padding-block:.25rem;border-radius: 0 0 12px 12px
    }
}

.notice img.moStore {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 10%
}

@media screen and (min-width: 768px) {
    .notice img.moStore {
        width:60px
    }
}

.notice img.eticket {
    -webkit-box-shadow: none;
    box-shadow: none;
    width: 22%
}

@media screen and (min-width: 768px) {
    .notice img.eticket {
        width:115px
    }
}

.notice {
    --notice-bg: #ffffff00;
    --notice-color: #000000;
    --notice-h4-color: #000000;
    margin: 1.5em auto;
    padding: 1.2em 1.4em;
    border-radius: 24px;
    text-align: left;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: min(96%,880px);
    color: var(--notice-color);
    background: var(--notice-bg);
    font-size: 1.75rem;
    background-color: #e9defa
}

.notice ul {
    margin: 0
}

.notice ul li {
    margin-bottom: .4em
}

.notice h4 {
    color: var(--notice-h4-color);
    margin: .8rem 0 .4rem
}

.notice h4:first-child {
    margin-top: 0
}

.notice h4:not(:first-child) {
    margin-top: 1em
}

@media screen and (max-width: 767px) {
    :root {
        --mb-message-02: 0.9375rem
    }

    .notice {
        font-size: var(--mb-message-02);
        width: 96%;
        padding: 1em 1.5em;
        border-radius: 2vw
    }

    .notice ul {
        padding-left: 1.5em
    }

    .notice ul li {
        margin-bottom: .25em
    }
}

.hero-backdrop-bottom {
    z-index: -1;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.hero-backdrop-bottom.for_phone {
    width: 100%
}

.pc_deco1 {
    z-index: 2;
    position: fixed;
    top: 800px;
    left: 750px;
    width: 100%;
    height: 100%;
    background: url(pc_deco1.png?t=1765953687149) no-repeat center top;
    pointer-events: none
}

.pc_deco2 {
    z-index: 2;
    position: fixed;
    top: 1000px;
    left: -750px;
    width: 100%;
    height: 100%;
    background: url(pc_deco2.png?t=1765953687149) no-repeat center top;
    pointer-events: none
}

.message-table {
    --th-color: #ffffff;
    --th-bg: #000000;
    --td-color: #333333;
    --td-bg: #ffffff;
    --border-color: #c9c9c9;
    width: min(96%,800px);
    margin-inline:auto}

.message-table table {
    width: 100%;
    overflow: hidden;
    font-size: 2rem;
    border-spacing: 0;
    font-weight: bolder;
    border-radius: 24px
}

.message-table table th,.message-table table td {
    padding-block:1.35rem}

.message-table table th {
    color: var(--th-color);
    background: var(--th-bg);
    border-color: var(--border-color);
    border-width: 0 1px 1px 0;
    border-style: solid
}

.message-table table td {
    color: var(--td-color);
    background: var(--td-bg);
    padding-block:1.3rem;border-color: var(--border-color);
    border-width: 0 1px 1px 0;
    border-style: solid
}

.message-table table td:last-child {
    border-width: 0 0 1px 0
}

.message-table table tr:last-child td {
    border-width: 0 1px 0 0
}

.message-table table tr:last-child td:last-child {
    border-width: 0
}

.message-table table .font-style--number {
    font-size: 1.2em;
    font-family: "Century Gothic","微軟正黑體","Microsoft JhengHei",Arial
}

.message-table table .table-amount {
    font-size: 1.5em
}

@media screen and (max-width: 767px) {
    .message-table table {
        width:100%;
        overflow: hidden;
        font-size: 1rem;
        border-radius: 2vw
    }

    .message-table table th {
        padding-block:.65rem}

    .message-table table td {
        padding-block:.6rem;border-width: 0 .1vw .1vw 0
    }
}

.game-award {
    position: relative;
    margin-inline:auto;width: min(96%,800px);
    font-family: "Century Gothic","Microsoft JhengHei","微軟正黑體",Arial,sans-serif
}

.game-award .PD_box {
    margin-top: 12px;
    margin-bottom: 12px
}

.game-award .PD_box ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-gap: 12px
}

.game-award .PD_box ul li {
    padding: 1.5em 0;
    width: 100%;
    background-color: #fff;
    border-radius: 15px
}

.game-award .tickets {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 7% auto 4%;
    padding-top: 2%;
    width: min(65%,330px);
    height: 88px;
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
    background: url(money.png?t=1765953687149) center top/100% no-repeat
}

.game-award h4 {
    margin-left: 31%;
    -ms-flex-preferred-size: 62%;
    flex-basis: 62%;
    text-align: center;
    color: #ff8600;
    font-size: 26px
}

.game-award h4>span {
    font-size: 56px
}

.game-award h3 {
    margin: 0;
    color: #404040;
    font-size: 34px
}

.game-award h3 b {
    font-size: 20px
}

.game-award h5 {
    margin: 0;
    color: #404040;
    font-size: 1.1em;
    font-weight: 400
}

.game-award .coupon .tickets {
    padding-top: 0;
    background: url(coupon.png?t=1765953687149) center top/100% no-repeat
}

.game-award .coupon h4 {
    color: #f200ca;
    -ms-flex-preferred-size: 67%;
    flex-basis: 67%;
    margin-left: 33%
}

.game-award .title_txt {
    margin: 0 18%;
    padding: 1% 0;
    color: #fff;
    background-color: #38c3c4;
    border: #ffe49a 1px solid;
    border-radius: 10em;
    font-weight: 800
}

.game-award .PD3 ul {
    grid-template-columns: repeat(3, minmax(0, 1fr))
}

.game-award .PD3 .tickets {
    width: min(70%,330px);
    height: 62px
}

.game-award .PD3 h4 {
    -webkit-transform: scale(0.75);
    transform: scale(0.75)
}

.game-award .PD1.PD3 ul li:first-child {
    grid-column-end: 4
}

.game-award .PD1 ul li:first-child {
    grid-column-start: 1;
    grid-column-end: 3
}

.game-award .PD1 ul li:first-child .tickets {
    margin-top: 5%;
    padding-top: 1.9%;
    height: 113px
}

.game-award .PD1 ul li:first-child .txt {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: baseline;
    -ms-flex-align: baseline;
    align-items: baseline;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.game-award .PD1 ul li:first-child .txt h5 {
    margin-left: 2%
}

.game-award .PD1 ul li:first-child h4 {
    -webkit-transform: scale(1.18);
    transform: scale(1.18)
}

.game-award .PD1.coupon ul li:first-child .tickets {
    padding-top: 0
}



.danji-pd-container .game_remind {
    --remind-txtcolor: #ffffff;
    --remind-bg: #f859d7;
    border-color: rgba(0,0,0,0)
}


.danji-pd-container .game_remind::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='295px' height='348px'%3E%3Cpath fill-rule='evenodd' fill='rgb(255, 255, 255)' d='M294.496,272.105 C294.132,274.973 292.956,281.433 289.179,280.959 L3.553,280.767 C-6.068,258.136 13.398,252.817 26.074,240.802 C38.266,229.244 45.048,213.504 45.368,197.353 C45.967,167.135 43.205,136.722 48.384,106.746 C50.908,92.140 55.319,77.409 63.932,65.166 C73.634,51.377 88.810,43.321 103.319,35.455 C106.757,33.590 110.229,31.782 113.768,30.114 C120.273,27.049 126.961,23.729 134.094,22.607 C136.917,20.594 131.951,1.633 145.469,0.261 C153.283,-0.532 158.630,2.684 159.588,10.698 C159.970,13.894 158.799,19.212 160.668,21.349 C175.635,27.276 190.432,33.859 204.115,42.388 C220.597,52.663 235.303,66.657 241.282,85.624 C250.847,115.972 250.296,150.413 249.867,181.989 C249.514,207.900 253.982,227.635 274.329,245.364 C278.812,249.271 286.626,252.978 290.213,257.809 C292.372,260.716 293.249,263.918 294.496,267.217 C294.364,268.806 294.692,270.552 294.496,272.105 ZM169.696,342.234 C136.983,357.435 98.562,337.069 94.256,301.434 L198.771,301.434 C198.125,318.698 185.022,335.113 169.696,342.234 Z'/%3E%3C/svg%3E");
    content: ""
}

.game_remind span {
    z-index: 1;
    position: relative;
    display: block;
    padding: .4em 0 0 .85em;
    height: 2.4em;
    line-height: 1.1em;
    overflow: hidden;
    font-weight: 600;
    font-size: .88em;
    color: var(--remind-txtcolor);
    vertical-align: middle
}

.WRAPPER {
    overflow: hidden
}

.cantantBase1,.cantantBase2 {
    display: none
}

/*# sourceMappingURL=pageLayout.min.css.map */