@charset "UTF-8";
:root{
  --basics-font: "Noto Sans TC", "Microsoft JhengHei", Arial, Helvetica, sans-serif;
  --first-size: 2rem;
  --second-size: 1.5rem;
  --third-size: 1.375rem;
  --fourth-size: 1.25rem;
  --basics-size: 1.125rem;
  --smallest-size: 1rem;
  --color-w: #ffffff;
  --color-bk: #000000;
  --color-grey: #333333;
  --color-line: #666666;
  --color-bg-w: #fff9e7;
  --color-bg-g: #67ff8f;
  --color-bg-b: #4affff;
  --color-bg-p: #ffcae8;
  --color-bg-y: #fffc7f;
  --color-light-gray: #ececec;
}

button{border: none;}
body, html{
-webkit-text-size-adjust: 100%;
text-rendering: optimizeLegibility !important;
-webkit-font-smoothing: antialiased !important;
font-family: var(--basics-font);}
body{overflow-x: hidden;}
p{color: var(--color-bk); line-height: 1.75; font-weight: 500;}

.kv-wrap{width: 100%; background: #ffca51 url(../img/kv-bg.jpg) center top repeat-y; background-size: 2560px; display: inline-block; overflow: hidden;}
.kv-td{width: 1000px; height: 550px; position: relative; margin: 0 auto;}
.kv-td ul{width: 100%; height: 100%;}
.kv-td ul li{position: absolute;}
.kv-td ul li img{width: 100%;}
.kv-tit-bg{width: 500px; left: 50%; margin-left: -250px;}
.kv-tit{width: 786px; left: 116px; top: 95px;}
.kv-tit-3{width: 241px; right: 98px; bottom: 167px;}
.kv-ad{width: 583px; left: 219px; bottom: 0;}
.kv-date{width: 181px; left: 116px; top: 95px;}
.kv-alt{width: 1300px; left: -150px; top: 0;}
.m-kv{display: none;}

.nav-wrap{width: 100%; background: #00da21; overflow: hidden; z-index: 9999; position: sticky; top: 0;}
.menu{text-align: center; display: flex; justify-content: center; align-items: center;}
.menu li{font-size: var(--third-size); font-weight: 700; color: var(--color-w);}
.menu li a{display: block; color: var(--color-w); transition: 0.5s; padding: 18px 50px;}
.menu li a:hover{color: #00da21; background: var(--color-w); transition: 0.5s; cursor: pointer;}
.menu li.noopen{color: #38a048; display: flex; align-items: end; padding: 18px 50px;}
.menu li.noopen span{font-size: 12px; border: 1px solid #38a048; border-radius: 30px; padding: 2px 10px; margin-bottom: 3px; margin-left: 10px;}
.mobile{display: none;}
.m-tit{display: none;}
#stickyHeader.fixed{position: fixed; top: 0; left: 0; width: 100%;}

section{width: 100%; overflow: hidden;}
.product-td{width: 1100px; position: relative; margin: 0 auto; text-align: center;}

/* 背景裝飾們 */
.dec{position: absolute; width: 200px;}
.dec-1{left: 50px; top: 70px;}
.dec-2{right: 80px; top: -30px;}
.dec-3{left: -30px; top: -30px;}
.dec-4{right: 0; bottom: -75px; z-index: 10;}
.dec-5{left: 50px; top: -35px;}
.dec-6{right: 80px; top: -5px;}
.dec-7{right: -200px; top: 100px;}
.dec-8{left: -130px; bottom: -30px;}
.dec-9{left: -30px; bottom: -90px;}
.dec-10{right: -100px; bottom: -150px;}
.dec-11{left: -20%; top: 35%;}
.dec-12{right: -20%; bottom: 18%;}
.dec-13{left: -25%; top: 30%;}
.pg-bg-alt-1{left: -400px; top: 40%; position: absolute; width: 396px;}
.pg-bg-alt-2{left: -260px; top: 30%; position: absolute; width: 583px;}

/* 背景圖片們 */
.pg-bg-1-1{background: url(../img/pg-bg-1-1.jpg) center top no-repeat, url(../img/pg-bg-1-2.jpg) center bottom no-repeat; background-size: 2560px; background-color: var(--color-bg-w); padding: 100px 0;}
.pg-bg-1-2{background: url(../img/pg-bg-2-1.jpg) center top no-repeat, url(../img/pg-bg-2-2.jpg) center bottom no-repeat; background-size: 2560px; background-color: var(--color-bg-b); padding: 20px 0 70px;}
.pg-bg-2{background: url(../img/pg-bg-3-1.jpg) center top no-repeat, url(../img/pg-bg-3-2.jpg) center bottom no-repeat; background-size: 2560px; background-color: var(--color-bg-g); padding: 60px 0 80px;}
.pg-bg-3{background: url(../img/pg-bg-4-1.jpg) center top no-repeat, url(../img/pg-bg-4-2.jpg) center bottom no-repeat; background-size: 2560px; background-color: var(--color-bg-w); padding: 30px 0 60px;}
.pg-bg-4{background: url(../img/pg-bg-5-1.jpg) center top no-repeat, url(../img/pg-bg-5-2.jpg) center bottom no-repeat; background-size: 2560px; background-color: var(--color-bg-p); padding: 50px 0 150px;}
.pg-bg-4-2{background-color: var(--color-bg-y); padding: 0 0 60px;}
.pg-bg-5{background: url(../img/pg-bg-6-1.jpg) center bottom no-repeat; background-size: 2560px; padding: 50px 0 150px;}

/* 標題顏色們 */
.tit-bg-1{background: var(--color-bg-g);}
.tit-bg-2{background:#5bf2ff;}
.tit-bg-3{background:#ff9958;}
.tit-bg-4{background:#ffa5ff;}
.tit-bg-5{background:#fff354;}
.tit-bg-6{color: #ff6f00;}
.tit-bg-7{color: #fd38ea;}
.tit-bg-8{background: var(--color-bg-w);}

.tit-wrap{display: inline-block; margin: 0 auto; text-align: center;}
.tit-wrap p, .tit-wrap p span{text-align: center; font-size: var(--second-size); font-weight: 700;}
.tit-wrap p.winner-list{color: var(--color-line); font-size: var(--fourth-size); font-weight: 500; margin-bottom: 40px;}
.tit-wrap p span{margin-left: 20px;}
.tit-wrap h2{width: 600px; margin: 0 auto 10px;}
.tit-wrap h2 img{width: 100%;}

/* 1 */
.table1{width: 650px; border: 3px solid var(--color-bk); margin: 60px auto 0;}
.table1-wrap{display: flex; border-bottom: 3px solid var(--color-bk);}
.table1-wrap:last-child{border-bottom: none;}
.title1{padding: 1em; border-right: 3px solid var(--color-bk); display: flex; align-items: center; justify-content: center; width: 50%; color: var(--color-bk); font-weight: 700;}
.title1:last-child{border-right: none;}
.title1 h2, .title1 p{font-size: var(--second-size);}
.title1 p span{font-size: var(--first-size); font-weight: 700;}

/* 2 */
.table2{width: 100%; margin: 60px auto 0; display: flex; flex-wrap: wrap; position: relative; z-index: 9;}
.title2-wrap{display: flex; align-items: stretch; width: 50%;}
.title2{flex-grow: 1; display: flex; flex-direction: column; justify-content: center; flex-wrap: wrap; color: var(--color-bk);}
.title2 h2{display: block; width: 100%; font-size: var(--second-size); padding: 0.7em; border-radius: 30px 30px 0 0; border: 3px solid var(--color-bk);}
.title2-content{display: flex; flex-direction: column; justify-content: center; width: 100%; padding: 1.5em 1em; border: 3px solid var(--color-bk); border-top: none; background: var(--color-w); margin-top: auto; flex-grow: 1;}
.title2 p{font-size: var(--fourth-size); font-weight: 500;}
.title2 p a, .directions li a{color: #00bac6; text-decoration: underline; font-weight: 700; padding: 0 2px 0 5px; cursor: pointer;}
.title2 p a:hover{color: #00cb00;}
.title2 p a:active{color: #00bac6;}
.title2 p span{font-weight: 700;}
.title2 span.att{font-size: var(--basics-size); color: var(--color-line); display: block; margin-top: 10px; font-weight: 500;}
.title2 span.highlight-y{background: url(../img/line-y.png) left bottom repeat-x; background-size: contain; display: inline;}
.title2 span.highlight-g{background: url(../img/line-g.png) left bottom repeat-x; background-size: 200px; display: inline;}
.title2:first-child{margin-right: -2px;}
.title2:last-child{margin-left: -2px;}
.Awards{display: inline-block; border-radius: 30px; padding: 2px 14px; background: var(--color-bk); color: var(--color-w); margin: 20px 0 15px;}
.quantity{border: 2px solid var(--color-bk); border-radius: 30px; padding: 1px 8px 2px; font-size: var(--smallest-size); margin-left: 6px; display: inline-block;}
.title2 span.area{font-size: var(--second-size);}

.prize{display: inline-block; margin: 0 auto; font-weight: 500; padding-left: 15px;}
.prize li{list-style-type: decimal; margin-left: 20px; margin-bottom: 8px; text-align: left; font-size: var(--fourth-size);}

.gift-wrap{display: flex; flex-wrap: wrap; margin: 20px auto 80px; position: relative; z-index: 9;}
.gift-wrap li{width: 25%;}
.gift-wrap li img{width: 100%;}
.gift-wrap li:nth-child(2n+2){margin-left: 0;}
.gift-wrap li:not(:first-child){margin-top: 0;}
.Notice{font-size: var(--third-size); font-weight: 500; line-height: 1.875;}
.Notice a{text-decoration: underline; color: var(--color-bk); text-underline-offset: 3px;}
.Notice a:active{color: var(--color-bk);}

.tabs{font-size: 0; list-style: none; padding-left: 0; display: block; overflow: hidden; margin-top: 50px;}
.tabs li{display: inline-block; width: 25%; text-align: center; border-radius: 15px 15px 0 0; border: 2px solid var(--color-bk); border-top: 3px solid var(--color-bk); border-bottom: none; background: var(--color-w);}
.tabs li:nth-child(1){border-right: 2px solid var(--color-bk); border-left: 3px solid var(--color-bk);}
.tabs li:nth-child(4){border-right: 3px solid var(--color-bk); border-left: 2px solid var(--color-bk);}
.tabs li a{text-decoration: none; display: block; padding: 8px 25px; position: relative; color: var(--color-bk);}
.tabs li.active, .tabs li:hover{background: #5bf2ff; border-radius: 15px 15px 0 0;}
.tabs li a h2, .tabs li a p{color: var(--color-bk); display: inline; font-weight: 700;}
.tabs li.active a h2, .tabs li a:hover h2{color: var(--color-bk);}
.tabs li h2{font-size: var(--second-size);}
.tabs li span{font-size: var(--basics-size); padding-left: 3px;}

.product-content{width: 100%; border: 3px solid var(--color-bk); margin-bottom: 10px;}
.product-list{width: 100%; padding: 20px 5px 25px; background: var(--color-w); border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; display: flex; text-align: left; flex-wrap: wrap;}
.product-list li{border-right: 3px #ccc dashed; border-width: 2px; width: 33.33%; display: inline-flex; align-items: stretch;}
.product-list li:nth-child(3), .product-list li:nth-child(6), .product-list li:nth-child(9){border-right: none;}
a.menulink{transition: .5s; flex-grow: 1; display: flex; flex-direction: column;}
a.menulink:hover h2{color: #00cb00; transition: .5s;}
a.menulink:hover img{filter: brightness(70%); transition: .5s;}
a.menulink:hover .card-btn{background: #00cb00; transition: .5s;}

.card{padding: 0 15px; flex-grow: 1; display: flex; flex-direction: column;}
.card-td img{width: 100%; margin-bottom: 10px; transition: .5s;}
.card-td h2{font-size: var(--second-size); color: #00bac6; font-weight: 700; transition: .5s; margin-bottom: 10px;}
.card-td p{font-size: var(--basics-size); margin-bottom: 10px;}
.card-price{font-size: var(--smallest-size); color: var(--color-grey); font-weight: normal; text-align: right; margin-top: auto;}
.big{color: #ff0033; font-size: var(--second-size); text-decoration: none; font-weight: 700; padding: 0 3px; line-height: 1.5;}
.addup{border: 1px solid var(--color-bk); border-radius: 30px; padding: 2px 8px 3px; font-size: 0.938rem; margin-right: 6px; font-weight: 500;}

.card-btn{font-size: var(--basics-size); color: var(--color-w); background: #00bac6; border-radius: 20px; text-align: center; padding: 3px 16px 5px; margin-top: 8px; display: block; float: right; transition: .5s; font-weight: 700;}
.cta{display: inline-block; width: 300px; height: 105px; background: url(../img/cta.png); background-size: 100%; margin: 40px auto 0; transition: .5s; cursor: pointer; text-indent: -9999px;}
.cta a{display: block; width: 100%; height: 100%;}
.cta:hover{background: url(../img/cta-hover.png); background-size: 100%; transition: .5s;}

.list{display: inline-block; width: 95%; text-align: left; margin: 0 auto; font-weight: 500; line-height: 1.75; position: relative; z-index: 9;}
.list h3{font-size: var(--basics-size); color: var(--color-bk); margin-bottom: 5px;}
.list p{color: var(--color-bk); font-weight: 700;}
.list li{list-style-type: decimal; margin-left: 20px; margin-bottom: 5px; font-size: var(--smallest-size); color: var(--color-grey);}
.list li a{color: #00bac6; text-decoration: underline; font-weight: 700; padding: 0 5px;}
.list li a:hover{color: #00cb00;}
.list li a:active{color: #00bac6;}
.list li ul li{list-style-type: disc; margin-top: 5px; margin-bottom: 0;}

.m-br{display: none;}

/* winner */
.winner-wrap{background: var(--color-bg-w);}
.instructions{width: 100%; border-radius: 30px 30px 0 0; background: #5bf2ff; padding: 1em; border: 3px solid var(--color-bk); border-bottom: none;}
.instructions h2{font-size: var(--second-size);}
.entry-content{width: 100%; border: 3px solid var(--color-bk); font-size: var(--fourth-size); color: var(--color-bk); line-height: 1.75}
table{width: 100%; border-collapse: collapse; border-spacing: 0; background: var(--color-w);}
table.rg-table tr{color: var(--color-bk); border-top: 3px solid var(--color-bk); text-align: center;}
table.rg-table tr:first-child{border-top: none;}
table.rg-table th{font-weight: 700; padding: 0.7em; background: var(--color-light-gray); color: var(--color-bk); font-size: var(--fourth-size); border-right: 3px solid var(--color-bk); border-bottom: 3px solid var(--color-bk); text-align: center;}
table.rg-table th:last-child{width: 40%;}
table.rg-table td{padding: 0.7em; border-right: 3px solid var(--color-bk); text-align: center; font-weight: 500;}
table.rg-table td:last-child, table.rg-table th:last-child{border-right: none;}
table.rg-table td h3{font-size: var(--third-size); display: inline-block;}
table.rg-table td p.quantity{font-size: var(--smallest-size); font-weight: 700;}
table.rg-table td span{margin-left: 20px;}
.number{background: var(--color-light-gray); width: 50px;}
.rg-mobile-wrap{display: none;}
.directions{font-size: var(--basics-size); font-weight: 700; margin: 40px auto 0; text-align: left; width: 95%; line-height: 1.75; padding-left: 20px;}
.directions li{list-style: disc; margin-bottom: 10px;}
.winner-list2{background: var(--color-bg-y); padding: 10px 0 60px;}

@media screen and (max-width: 1300px) {
.product-td{width: 90%; left: 0; margin-left: 5%;}
.dec-1{left: 7%; top: 17%;}
.dec-2{right: 10%; top: -5%;}
.dec-3{left: 0; top: -14%;}
.dec-4{bottom: -13%;}
.dec-5{left: 8%; top: -2.4%;}
.dec-6{right: 11%; top: -0.5%;}
.dec-7{right: 0; top: 0;}
.dec-8{left: -5%; bottom: -2%;}
.dec-9{left: -2%; bottom: -9%;}
.dec-10{right: 0; bottom: -18%;}
.pg-bg-alt-1{left: -15%; top: 31%;}
.pg-bg-alt-2{left: -25%; top: 30%;}
.dec-11, .dec-12, .dec-13{display: none;}
}

@media screen and (max-width: 1100px) {
.menu li a, .menu li.noopen{padding: 15px 30px;}
.dec-1{left: -4%;}
.dec-2{right: 0;}
.dec-3{left: -10%;}
.dec-5{left: 0;}
.dec-6{right: 7%;}
.dec-7{right: -5%;}
.pg-bg-alt-1{top: 35%;}
}

@media screen and (max-width: 930px) {
.dec-3{left: -14%;}
.dec-4{right: -10%;}
.dec-8{bottom: 36.8%; z-index: 10;}
.pg-bg-alt-2{left: -35%;}
.entry-content{overflow: hidden;}
}

@media screen and (max-width: 900px) {
.kv-wrap{display: none;}
.m-kv{display: block; width: 100%;}
.m-kv img{width: 100%;}
.list{width: 100%;}
.gift-wrap li{width: 33%;}
.dec-1{left: -10%;}
.dec-4{right: -11%; bottom: -10%;}
.dec-8{bottom: 50.6%;}
}

@media screen and (max-width: 850px) {
.dec-3{left: -15%; top: 7%;}
.dec-4{bottom: -11%;}
.dec-8{bottom: 47.5%;}
}

@media screen and (max-width: 800px) {
.pg-bg-1-1{padding: 60px 0 80px;}
.pg-bg-1-2{padding: 20px 0 80px;}
.pg-bg-4{padding: 30px 0 140px;}
.dec{width: 150px;}
.dec-1{left: -8%; top: 24%;}
.dec-2{right: 0; top: -2%;}
.dec-3{left: -4%; top: 27%; z-index: 10;}
.dec-4{right: 0; bottom: -18%;}
.dec-5{top: -1%;}
.dec-7{ top: 1%;}
.dec-9{ bottom: -3%;}
.dec-10{ bottom: -11%;}
.tit-wrap h2, .table1{width: 90%;}
.menu li.noopen{justify-content: center;}
.product-list{padding: 0 20px;}
.product-list li{border-right: none; width: 50%; padding: 30px 0;}
.product-list li:last-child{border-bottom: none;}
.nav-wrap{position: relative; z-index: 999;}
.mobile{display: block;}
.nav-wrap ul{padding: 0; opacity: 0;}
.nav{width: 60px; height: 0; color: var(--color-w);}
.menu{margin-top: 60px; width: 100%; padding: 0; pointer-events: none; flex-wrap: wrap; justify-content: left; max-height: 0; opacity: 0; overflow: hidden; transition: max-height 0.5s ease-out, opacity 0.2s ease-out;}
.menu.open{background: var(--color-w); pointer-events: auto; max-height: 100vh; opacity: 1; transition: max-height 1.5s ease-out, opacity 1s ease-out;}
.menu li{font-size: var(--fourth-size); margin: 0; border-bottom: 1px solid #bbbbbb; width: 100%;}
.menu li a{display: block; width: 100%; padding: 15px 10px; color: #00da21;}
.menu li:after{content: none;}
.menu li.noopen{padding: 15px 10px; color: #bbbbbb;}
.menu li.noopen span{border: 1px solid #bbbbbb; margin-bottom: 0;}
.hamburger{font-size: 50px; display: inline-block; width: 38px; height: 38px; margin: 0 auto; padding: 0; cursor: pointer; transition: transform .2s ease-in-out; margin: 15px 12px 0 12px; vertical-align: middle; border: 0 none; background: transparent;}
.hamburger:focus{outline: 0;}
.hamburger:before, .hamburger:after{content: ""; box-sizing: border-box;}
.hamburger:before, .hamburger .icon, .hamburger:after{display: block; width: 40px; height: 2px; margin: 0 0 6px; transition: transform .5s ease-in-out; background: var(--color-w);}
.hamburger.active .icon{transform: scale(0);}
.hamburger.active:before{transform: translateY(7px) rotate(135deg);}
.hamburger.active:after{transform: translateY(-9px) rotate(-135deg);}
.m-tit{display: block; position: absolute; line-height: 62px; left: 70px;}
.m-tit h2{color: var(--color-w); font-size: var(--fourth-size); font-weight: 700;}
.tabs{margin: 20px 0 10px;}
.tabs li{width: 24%; margin: 2% 0.5%; border: 3px solid var(--color-bk); border-radius: 50px;}
.tabs li a{padding: 10px 5px;}
.tabs li.active, .tabs li:hover{border-radius: 50px;}
.instructions h2, .title1 h2, .title1 p, .title2 h2, .title2 span.area, .tit-wrap p, .tit-wrap p span, .tabs li h2, .tabs li span, .card-td h2, .big{font-size: var(--third-size);}
.big{line-height: 1;}
.card-td h2{margin-bottom: 20px;}
.m-br{display: block;}
.gift-wrap{margin: 20px auto 50px;}
.table1, .table2{margin: 50px auto 0;}

table{display: none;}
.rg-mobile-wrap{display: block; overflow: hidden;}
.rg-mobile-wrap h3{font-size: var(--third-size); margin-bottom: 5px;}
.rg-mobile-wrap p{font-size: var(--basics-size); line-height: 1.5;}
.rg-mobile-wrap p.quantity{font-size: var(--smallest-size); font-weight: 700;}
.rg-row{display: flex; border-bottom: 3px solid var(--color-bk);}
.rg-row:last-child{border-bottom: none;}
.rg-row.noo-line{border-bottom: none;}
.rg-label{background: var(--color-w); color: var(--color-bk); padding: 0.7em; font-weight: 700; line-height: 1.5; flex: 0 1 80px; display: flex; justify-content: center; align-items: center; border-right: 3px solid var(--color-bk); font-size: var(--basics-size);}
.rg-value{flex: 1; padding: 0.7em; display: flex; justify-content: center; align-items: center; background: var(--color-w);}
.rg-value.no-padding{padding: 0;}
.winner{text-align: center; padding: 10px;}
.number{background: var(--color-light-gray);}
.pg-bg-5{background: url(../img/pg-bg-6-2.jpg) center bottom no-repeat; background-size: 1000px; padding: 50px 0 80px;}
.winner-list2{padding: 30px 0 80px;}
}

@media screen and (max-width: 700px) {
.dec-1{left: -10%; top: 18%;}
.dec-3{top: 23%;}
.dec-6{top: -3%;}
.dec-8{bottom: 43.5%;}
.dec-9{left: -5%; bottom: -5%;}
.dec-10{bottom: -11%;}
.pg-bg-alt-2{left: -50%;}
.rg-value h4{font-size: var(--fourth-size);}
}

@media screen and (max-width: 640px) {
.title2-wrap{width: 100%;}
.title2-content{border-radius: 0 0 30px 30px;}
.title2:first-child{margin-right: 0;}
.title2:last-child{margin-left: 0; margin-top: -3px;}
.instructions h2, .Notice, .title1 h2, .title1 p, .title2 h2, .title2 span.area, .tit-wrap p, .tit-wrap p span, .tabs li h2, .tabs li span, .card-td h2, .big{font-size: var(--fourth-size);}
.title2 p{font-size: var(--basics-size);}
.title2 span.att{font-size: var(--smallest-size);}
.dec-3{left: -3%; top: 15%;}
.dec-4{bottom: -14%;}
.dec-5{left: -5%; top: -1.5%;}
.dec-6{right: 5%;}
.dec-7{right: -8%; top: 1%;}
.dec-8{bottom: 39.5%;}
.rg-value{flex-direction: column;}
.winner:first-child{padding-bottom: 0;}
.winner:last-child{padding-top: 0;}
.rg-mobile-wrap h3{font-size: var(--fourth-size);}
}

@media screen and (max-width: 600px) {
.product-content{border-radius: 5px;}
.tabs li{width: 48%; margin: 2% 1%;}
.product-list li{width: 100%; border-bottom: 3px #ccc dashed; border-width: 2px;}
.product-list{padding: 30px 20px 0; flex-direction: column;}
.product-list li:first-child{padding-top: 0;}
.gift-wrap li{width: 60%;}
.gift-wrap li:nth-child(2n+2){margin-left: auto;}
.gift-wrap li:not(:first-child){margin-top: -20%;}
.gift-wrap li:first-child{margin-left: 0;}
.pg-bg-alt-1{left: 55%; top: 23%; width: 100%;}
.pg-bg-alt-2{left: -50%; width: 100%;}
.dec-7{top: 0;}
.dec-5{top: -0.5%;}
.dec-8{bottom: 67%;}
.dec-9{bottom: -2%;}
.dec-10{bottom: -6%;}
}

@media screen and (max-width: 500px) {
.tit-wrap h2, .table1{width: 100%;}
.pg-bg-1-1{padding: 60px 0 30px;}
.pg-bg-1-2{padding: 40px 0 10px;}
.pg-bg-2{padding: 60px 0 20px;}
.pg-bg-3{padding: 50px 0 20px;}
.pg-bg-4{padding: 50px 0 80px;}
.card{padding: 0;}
.cta{margin: 20px auto 40px;}
.title1 p span{font-size: var(--second-size);}
.dec-1{left: -13%; top: 28%;}
.dec-2{right: -5%; top: 9%; z-index: 10;}
.dec-4{right: -8%; bottom: 29.5%;}
.dec-5{top: -1.5%;}
.dec-7{right: 0; top: 3.5%; z-index: 10;}
.dec-8{bottom: 79.5%;}
.dec-9{left: -10%; bottom: -4%;}
.dec-10{bottom: -4%;}
.pg-bg-alt-1{top: 26%;}
.gift-wrap{margin: 0 auto 40px;}
.cta{width: 250px; height: 87px;}
.rg-label{padding: 0.7em;}
}

@media screen and (max-width: 400px) {
.cta{width: 200px; height: 70px;}
.tit-wrap p, .title1 h2, .title1 p{font-size: var(--basics-size);}
.tit-wrap p span{margin-left: 0; display: block; font-size: var(--basics-size);}
.title1 p span{font-size: var(--fourth-size);}
.dec-1{top: 13%;}
.dec-2{right: -18%; top: -5%;}
.dec-3{left: -23%; top: 8%;}
.dec-4{bottom: 32%;}
.dec-5{left: -12%;}
.dec-6{right: -5%;}
.dec-7{right: -5%;}
.dec-8{left: -10%; bottom: 75.6%;}
.dec-10{bottom: -5%;}
.pg-bg-alt-1{top: 38%;}
.table1, .table2{margin: 30px auto 0;}
.rg-mobile-wrap h3{font-size: var(--basics-size); line-height: 1.5;}
.directions{width: 100%;}
.tit-wrap p.winner-list{font-size: var(--basics-size);}
}

@media screen and (max-width: 376px) {
.pg-bg-1-1{padding: 60px 0 20px;}
.pg-bg-1-2{padding: 50px 0 5px;}
.pg-bg-3{padding: 60px 0 10px;}
.pg-bg-4{padding: 60px 0 80px;}
.m-tit h2, .menu li{font-size: var(--basics-size);}
.dec-1{top: 23%; left: -15%;}
.dec-2{right: -26%; top: -6%;}
.dec-3{left: -24%;}
.dec-5{left: -12%; top: -2%;}
.dec-6{right: -15%; top: -2%;}
.dec-7{right: -8%; top: 3.6%;}
.dec-8{bottom: 76.2%;}
.dec-9{left: -14%; bottom: -5%;}
.dec-10{right: -4%;}
.pg-bg-alt-1{top: 46%;}
.Notice{font-size: var(--basics-size);}
.title1 p{line-height: 1.5;}
.title1 p span{display: block;}
}

@media screen and (max-width: 320px) {
.dec-1{top: 22%;}
.dec-3{left: -30%;}
.dec-4{right: -12%; bottom: 33.5%;}
.dec-5{left: -14%;}
.dec-7{right: -17%;}
.dec-8{bottom: 74.2%;}
}

/* animation */
.pulse{
  animation: pulse .5s;
  animation-iteration-count: infinite;
}

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

.expandOpen{
	animation: expandOpen 0.5s;
	visibility: visible !important;	
}

@keyframes expandOpen {
	0%{transform: scale(3); opacity: 0;}
  30%{transform: scale(3); opacity: 0;}
	90%{transform: scale(0.9); opacity: 1;}	
  100%{transform: scale(1);}
}

.fadeIn{
	animation: fadeIn 0.5s;
	visibility: visible !important;	
}

@keyframes fadeIn{
	0%{transform: scale(0); opacity: 0;}
	100%{transform: scale(1); opacity: 1;}		
}

.fadeIn2{
	animation: fadeIn2 0.7s;
	visibility: visible !important;	
}

@keyframes fadeIn2{
	0%{transform: scale(0); opacity: 0;}
  50%{transform: scale(0); opacity: 0;}
	100%{transform: scale(1); opacity: 1;}		
}

.slideUp{
	animation: slideUp 1s;
	visibility: visible !important;			
}

@keyframes slideUp {
	0%{transform: translateY(50%); opacity: 0;}
  50%{transform: translateY(50%); opacity: 0;}
	100%{transform: translateY(0%); opacity: 1;}	
}