#body { margin: 0px; height: 100%; font-family: "Microsoft JhengHei", "Segoe UI", sans-serif; }
h1 { font-size: 36px; text-align: center; color: rgb(255, 255, 255); font-weight: normal; }
h2 { font-size: 30px; font-weight: bolder; }
.premium_card img { margin: 0px auto; width: 100%; padding: 0px; }
#header { background: rgb(255, 255, 255); }
#header > a:nth-child(9) { display: none; }
.remote-nav { margin: 10px 0px -15px; text-align: right; }
.remote-nav li { display: inline-block; padding: 0px 15px 0px 1em; }
.remote-nav a { color: rgb(0, 51, 130); font-size: 13px; }
.memberMenu a { color: rgb(0, 0, 0); }
.noscript { border: 2px solid rgb(191, 0, 0); background: rgb(255, 239, 239); padding: 10px 25px; margin-bottom: 10px; }
.site-id { background: url("https://image.card.tw.r10s.com/images/common/logo/ttl_rcms.png") 0% 0% / 294px 32px no-repeat; float: left; margin: 0px 0px 15px 20px; width: 294px; height: 32px; text-indent: -9999px; }
.site-id a { display: block; width: 294px; height: 32px; }
.new-site-id { background: url("https://image.card.tw.r10s.com/images/common/logo/ttl_rcms.png") 0% 0% / 294px 32px no-repeat; float: left; margin: 0px 0px 15px 20px; width: 294px; height: 32px; text-indent: -9999px; }
.new-site-id a { display: block; width: 294px; height: 32px; }
.corp-id { background: url("https://image.card.tw.r10s.com/images/common/logo/ttl_rc_c.gif") 0% 0% / 228px 32px no-repeat; float: left; margin: 10px 0px 10px 14.5%; width: 228px; height: 32px; text-indent: -9999px; }
.corp-id a { display: block; width: 228px; height: 32px; margin-bottom: 4px; }
.new-corp-id { background: url("https://image.card.tw.r10s.com/images/common/logo/ttl_rc_c.gif") 0% 0% / 228px 32px no-repeat; float: left; margin: 10px 0px 0px 30px; width: 228px; height: 32px; text-indent: -9999px; }
.new-corp-id a { display: block; width: 228px; height: 32px; }
.header-bnr { float: left; }
.logout { float: right; margin: 18px 0px 0px; padding: 0px 15px 0px 0px; list-style: none; }
.logout a { font-size: 15px; font-weight: bold; display: block; background: rgb(191, 0, 0); padding: 5px 10px; cursor: pointer; color: rgb(255, 255, 255) !important; }
.new-logout, .new-apply { float: right; padding: 0px 14.6% 0px 0px; }
.new-logout a { color: rgb(255, 255, 255); font-size: 15px; font-weight: bold; display: block; background: rgb(191, 0, 0); padding: 5px 10px; cursor: pointer; border-radius: 3em; margin-left: 5px; line-height: 23px; border: 2px solid rgb(191, 0, 0) !important; }
.new-apply a { color: rgb(191, 0, 0); font-size: 15px; font-weight: bold; display: block; background: rgb(255, 255, 255); padding: 5px 10px; cursor: pointer; border-radius: 3em; margin-left: 5px; line-height: 23px; border: 2px solid rgb(191, 0, 0) !important; }
.promotion { float: right; margin: 18px 15px 0px 0px; }
.promotion a { color: rgb(191, 0, 0); font-weight: bold; border: 1px solid rgb(191, 0, 0); display: block; font-size: 15px; padding: 4px 10px; }
#sec01 {height: auto;background-color: rgb(231, 0, 18);position: relative;}
#sec02 { background-color: rgb(255, 239, 223); background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/sea.jpg"); background-repeat: no-repeat; background-position: center bottom; padding: 20px 20px 150px; position: relative; }
.shopping { font-size: 30px; color: rgb(255, 255, 255); }
#sec03 { background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/sakura_bg.jpg"); background-repeat: no-repeat; height: auto; background-position: center bottom; background-color: rgb(245, 220, 198); padding: 20px; position: relative; }
#sec04 { background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/jcb_bg.jpg"); background-repeat: repeat; height: auto; padding: 20px; position: relative; }
.rakuten_group { background-color: rgb(255, 255, 255); border-radius: 20px; padding: 30px; display: inline-flex; }
.rakuten_bank { text-align: center; padding: 20px 20px 0px 0px; border-right: 1px solid rgb(51, 51, 51); width: 100%; }
.rakuten_bank img { width: 200px; }
.rakuten_bank p { font-size: 40px; font-weight: bold; color: rgb(231, 0, 18); line-height: 1.5; }
.bank { border: 3px solid rgb(231, 0, 18); padding: 40px 10px 10px; }
.rakuten_travel { text-align: center; padding: 10px; width: 500px; }
.rakuten_travel img { width: 200px; }
.takuten_travel_discount { color: rgb(0, 190, 0); font-size: 60px; font-weight: bold; }
.rakuten_travel dl { text-align: center; }
.rakuten_travel dt { font-size: 18px; font-weight: bold; padding-top: 40px; }
.rakuten_travel dd { font-size: 18px; }
.info_btn { color: rgb(255, 255, 255); font-size: 14px; line-height: 2.7; background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/coupon_btn.png"); background-repeat: no-repeat; background-position: center center; height: 40px; }
.info_btn:hover { background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/coupon_btn_hover.png"); background-repeat: no-repeat; background-position: center center; height: 40px; }
.coupon_btn { color: rgb(255, 255, 255); font-size: 14px; line-height: 4.5; }
.coupon { display: flex; justify-content: center; margin: 20px auto; }
.coupon li p { color: rgb(0, 0, 0); font-size: 14px; line-height: 2; }
.coupon li {
  text-align: center; width: 210px; height: 285px; transform: translate(0%, 0%); padding: 10px; border-radius: 10px; background: linear-gradient(rgb(255, 255, 255) 85%, black 20%); transform-origin: 50% 50%; margin: 10px; list-style: none;
  &::before, &::after { content: ""; display: block; position: absolute; height: 15px; width: 15px; background: rgb(245, 220, 198); border-radius: 100px; top: 85%; }
  &::before { left: 0px; transform: translate(-50%, -30%); }
  &::after { right: 0px; transform: translate(50%, -30%); }
}
.coupon__tearaway { display: block; position: absolute; width: 97%; height: 84%; right: 0px; top: 0px; border-bottom: 5px dotted rgb(252, 252, 250); }
.coupon a { text-decoration: none; }
.coupon a:hover { opacity: 0.7; }
.jcb_coupon a { text-decoration: none; }
.jcb_coupon { display: flex; justify-content: center; margin: 20px auto; }
.jcb_coupont { color: rgb(0, 0, 0); font-size: 16px; padding: 20px 10px 0px; overflow: hidden; white-space: normal; height: 70px; text-overflow: ellipsis; line-height: 1.3; }
.discount { font-size: 40px; font-weight: bold; font-family: sans-serif; }
.store_title { color: rgb(255, 255, 255); line-height: 3; }
.jcb_discountr { background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/coupon_r.jpg"); background-repeat: repeat; color: rgb(255, 255, 255); height: 90px; }
.jcb_discounty { background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/coupon_y.jpg"); background-repeat: repeat; color: rgb(255, 255, 255); height: 90px; }
.jcb_card {
  text-align: center; width: 210px; height: 275px; transform: translate(0%, 0%); border-radius: 10px; background: linear-gradient(rgb(0, 0, 0) 15%, rgb(255, 255, 255) 0%); transform-origin: 50% 50%; margin: 10px; list-style: none;
  &::before, &::after { content: ""; display: block; position: absolute; height: 15px; width: 15px; background: rgb(255, 238, 220); border-radius: 100px; top: 46%; }
  &::before { left: 0px; transform: translate(-50%, -30%); }
  &::after { right: 0px; transform: translate(50%, -30%); }
}
.jcb_coupon__tearaway { display: block; position: absolute; width: 97%; height: 46%; right: 0px; top: 0px; border-bottom: 5px dotted rgb(255, 238, 220); }
.jcb_coupon a { text-decoration: none; }
.panda_dicount table { border-collapse: collapse; width: 100%; }
.panda_dicount th, td { padding: 20px 10px; font-size: 16px; }
.panda_dicount th { background-color: rgb(0, 0, 0); color: rgb(255, 255, 255); text-align: center; }
.panda_dicount td { background-color: rgb(255, 255, 255); text-align: center; }
.dicount { font-size: 50px; font-family: "Arial Black", sans-serif; font-weight: bold; color: rgb(230, 0, 18); line-height: 35px; }
.dicountk { font-size: 50px; font-family: "Arial Black", sans-serif; font-weight: bold; line-height: 35px; }
.link { display: flex; padding: 20px 0px; align-items: center; font-size: 18px; }
.bg-red { background-color: rgb(230, 0, 18); color: rgb(255, 255, 255); padding: 10px 20px; border-radius: 50px; margin-right: 10px; }
.step3 {
  display: flex; flex-wrap: wrap; gap: 20px; margin: 20px 0px;
  & .abox { flex: 1 1 0%; background-color: rgb(249, 185, 183); padding: 20px; border-radius: 20px; }
}
.title { text-align: center; margin: 30px auto; }
small { font-size: 14px; }
@keyframes panda_title { 
  0% { opacity: 0; transform: translate3d(0px, -20%, 0px); }
  100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
.panda_title { animation: 3s ease 0s 1 alternate forwards running panda_title; text-align: center; }
@keyframes cloudy { 
  0% { opacity: 0; transform: translate3d(0px, 20%, 0px); }
  100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
.cloudy { animation: 3s ease 0s 1 alternate forwards running cloudy; text-align: center; background-image: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/cloudy.png"); background-repeat: no-repeat; background-size: cover; background-position: center bottom; height: 700px; position: relative; top: -220px; }
.contents-inner {width: 1024px;margin: 0px auto;padding: 50px 0px;}
@keyframes apply_tbn { 
  0% { transform: translateY(20px); }
  50% { transform: translateY(50px); }
  100% { transform: translateY(20px); }
}
.apply_tbn { top: 20%; right: 10%; position: absolute; z-index: 1; animation: 5s ease 0s infinite alternate none running apply_tbn; }
.pandacard { margin-left: 15%; }
@keyframes card_left { 
  0% { transform: translateX(0px); }
  100% { transform: translateX(20px); }
  0% { opacity: 0; }
  100% { opacity: 1; }
}
.panda_card_left { position: relative; top: -155px; display: inline-flex; animation: 3s ease 0s 1 alternate forwards running card_left; overflow: hidden; }
@keyframes card_right { 
  0% { transform: translateX(0px); }
  100% { transform: translateX(-20px); }
  0% { opacity: 0; }
  100% { opacity: 1; }
}
.panda_card_right { position: relative; display: inline-flex; animation: 3s ease 0s 1 alternate forwards running card_right; overflow: hidden; left: 70px; }
@-webkit-keyframes fadeInDown { 
  0% { opacity: 0; transform: translateY(-20px); }
  100% { opacity: 1; transform: translateY(20px); }
}
@keyframes fadeInDown { 
  0% { opacity: 0; transform: translateY(-20px); }
  100% { opacity: 1; transform: translateY(20px); }
}
.fadeInDown { animation-name: fadeInDown; }
.discount { font-size: 45px; font-weight: bold; line-height: 2; }
.big { font-size: xx-large; }
.small { font-size: x-small; }
.red { color: rgb(217, 32, 1); }
.btn_box { display: flex; justify-content: center; margin: 0px auto; }
.card_btn { font-size: 16px; padding: 10px 20px; color: rgb(255, 255, 255); border: 2px solid rgb(231, 0, 18); border-radius: 50px; margin: 10px; text-decoration: none; background-color: rgb(231, 0, 18); display: inline-block; }
.card_btn:hover { background-color: rgba(255, 255, 255, 0.19); color: rgb(231, 0, 18); }
.more_btn { display: flex; width: 160px; height: 25px; text-decoration: none; color: rgb(170, 170, 170); background: url("https://image.card.tw.r10s.com/images/common/landing/ad11/more.png") right center / auto no-repeat; margin: 50px auto; transition-duration: 0.5s; }
.more_btn:hover { color: rgb(184, 184, 184); transition-duration: 0.5s; background: url("https://image.card.tw.r10s.com/images/common/landing/ad11/more.png") right center / auto no-repeat; transform: translateX(10px); }
.domestic_restaurants {display: flex;flex-flow: row;margin: 20px auto;justify-content: center;}
.domestic_restaurants li { list-style: none; margin: 1%; text-align: center; }
.domestic_restaurants li a { text-decoration: none; }
.domestic_restaurants li:hover { text-decoration: none; transform: scale(1.02); transition: 0.2s; }
.cardcontainer { padding: 165px 10px 10px; }
.cardcontainer p { font-size: 16px; line-height: 1.3; color: rgb(255, 255, 255); }
@keyframes dot { 
  100% { transform: scale(1.3); }
}
.modal-content { padding: 1%; border-radius: 30px !important; }
.modal-info { padding: 5%; display: inline-table; }
.modal-info h1 { color: rgb(244, 67, 54); border-bottom: 2px solid; font-size: 30px; font-weight: bold; text-align: center; margin-bottom: 30px; padding-bottom: 20px; }
.modal-info h3 { color: rgb(244, 67, 54); font-size: 20px; font-weight: bold; text-align: left; line-height: 2.5; }
.qualifications li { width: 100%; text-align: left; font-size: 16px; list-style: decimal; display: list-item; padding: 5px; }
.qualifications_number li { width: 100%; text-align: left; font-size: 16px; list-style: decimal; display: list-item; padding: 5px; }
.style-disc li { list-style: disc; }
.info_star li {width: 100%;text-align: left;font-size: 16px;list-style: decimal;display: list-item;padding: 5px;font-weight: bold;}
.footer { padding: 20px 10px; color: rgb(51, 51, 51); text-align: center; background-color: rgb(255, 255, 255); }
.footer .text-title { font-size: 1.5rem; line-height: 2; }
.footer p { font-size: 0.9rem; }
.airplan { top: 5%; left: 5%; position: absolute; }
.airplan img { width: 80%; }
.korea_food { top: 47%; left: 21%; position: absolute; z-index: 1; }
.korea_i1 { left: 2%; position: absolute; top: -50px; }
.japan_i1 { top: 63%; right: 3%; position: absolute; z-index: 1; }
.take_photo_i { top: 22.4%; left: 10%; position: absolute; z-index: 1; }
.building_i { top: 20%; right: 2%; position: absolute; }
.korea_i2 { top: 15%; left: -1%; position: absolute; z-index: 1; }
.shopping_i3 { bottom: -1%; left: 2%; position: absolute; }
.shopping_i { bottom: -1%; right: 2%; position: absolute; }

.travel_i { right: 2%; position: absolute; z-index: 1; top: 19.7%; }
.biccamera { background-color: rgb(255, 255, 255); border-radius: 30px; border: 5px solid rgb(0, 0, 0); padding: 10px; display: flex; vertical-align: middle; margin: 0px 15px; }
.biccamera .logo { width: 12%; margin: 10px 20px 0px 10px; }
.biccamera .logo img { width: 100%; border-radius: 15px; }
.biccamera p { color: rgb(0, 0, 0); font-size: 22px; font-weight: 600; line-height: 1.8; padding-top: inherit; }
.card_gift { display: flex; margin: 120px auto 0px; }
.card_gift li { border: 5px solid rgb(0, 0, 0); margin: 20px; list-style: none; border-radius: 30px; width: 50%; text-align: center; background: linear-gradient(rgb(0, 0, 0) 18%, rgb(255, 255, 255) -82%); height: 450px; }
.subtitle { position: relative; top: -55px; }
.subtitle p { color: rgb(255, 255, 255); font-size: 25px; font-weight: 400; }
.subtitle .recommend { color: rgb(0, 0, 0); font-size: 25px; font-weight: 600; }
.subtitle h1 { color: rgb(231, 0, 18); font-size: 45px; font-weight: 800; }
.gift_text-center { margin-top: 10px; padding: 20px; }
@keyframes shopping_i2 { 
  0% { transform: translateY(20px); }
  50% { transform: translateY(50px); }
  100% { transform: translateY(20px); }
}
.shopping_i2 { top: 5%; left: 10%; position: absolute; z-index: 1; animation: 5s ease 0s infinite alternate none running shopping_i2; }
@keyframes beer_i { 
  0% { transform: translateY(20px); }
  50% { transform: translateY(50px); }
  100% { transform: translateY(20px); }
}
.beer_i { bottom: 6%; left: 7%; position: absolute; z-index: 1; animation: 5s ease 0s infinite alternate none running beer_i; }
.swiper-container a { text-decoration: none; }
#backlink-inner { display: none !important; }
#timer {font-family: Arial, sans-serif;font-size: 20px;color: rgb(0, 0, 0);letter-spacing: -1px;text-align: center;}
#timer span { font-size: 100px; color: rgb(0, 0, 0); margin: 0px 3px 0px 15px; }
#timer span:first-child { margin-left: 0px; }
#seconds { color: rgb(255, 255, 255) !important; }
@keyframes sakura_cloudy_i { 
  0% { transform: translateX(20px); }
  50% { transform: translateX(50px); }
  100% { transform: translateX(20px); }
}
.sakura_cloudy_i { top: 5%; right: 18%; position: absolute; z-index: 1; animation: 5s ease 0s infinite alternate none running sakura_cloudy_i; }
.btn-gradient { animation-duration: 2.5s; animation-iteration-count: infinite; }
.btn-gradient {
  padding: 10px; text-align: center; margin: 10px auto;
  & a {
  text-align: center; width: 40%; padding: 10px; min-width: 40%; max-width: 40px; transition: 450ms cubic-bezier(0.23, 1, 0.32, 1); place-content: center; display: flex; align-items: center; color: rgb(255, 255, 255); margin: 0px auto; background: linear-gradient(to right, rgb(253, 28, 28) 0%, rgb(229, 0, 0) 100%); border: 3px solid rgb(0, 0, 0); border-radius: 100px; box-shadow: rgb(0, 0, 0) 5px 5px; text-decoration: none;
  & span {
  flex: 1 1 auto; font-size: 25px; font-family: "Noto Sans TC", Arial, 微軟正黑體, 新細明體, sans-serif; font-weight: 800 !important;
  &.icon {
  transition: 450ms cubic-bezier(0.23, 1, 0.32, 1); position: relative; padding-right: 80px;
  &::after { content: ""; position: absolute; transition: 450ms cubic-bezier(0.23, 1, 0.32, 1); width: 45px; height: 45px; top: calc(50% - 22.5px); right: 10px; background: url("https://stg.image.card.tw.r10s.com/images/common/landing/ad04/icon_arr.png") center center / cover no-repeat; }
}
}
  &:hover {
  background-color: rgb(39, 208, 202); color: rgb(255, 255, 255);
  & .icon {
  padding-right: 35px;
  &::after { right: 15px; }
}
}
}
}
@media screen and (min-width: 768px) and (max-width: 991px) { ... }
    .korea_i2,.travel_i,.japan_i1,.building_i,.shopping_i,.shopping_i3{
        display: none
      
    }
  .take_photo_i{margin-left:-60px;}
  .korea_food{left:0px;}
  .korea_i1 img{width:80%;margin-left:120%;margin-top:-50px}
  .apply_tbn{top:900px;right:0px}
  .domestic_restaurants img{width:100%;}

}