* {
  margin: 0px;
  padding: 0px;
}

.header {
  background-color: #000;
}

.footer {
  background-color: #000;
}
body {
  width: 100%;
  margin: 0;
  padding: 0;
  word-wrap: break-word;
}
.wrap-topview {
  background-image: url(../images/kv_bg.png);
  background-repeat: no-repeat;
  background-position: center top;
  overflow-x: hidden;
  margin-top: 120px;
  background-color: #f0841a;
}
@media (max-width: 970px) {
  .wrap-topview {
    margin-top: 60px;
    background-size: auto 100%;
  }
}

/*------------tab------------*/
.tab_pc {
  width: 100%;
  position: fixed;
  top: 70px;
  background: #e05110;
  z-index: 15;
}
.tab {
  display: flex;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
}
.tab a {
/*   flex-grow: 1; */
  display: flex;
  /*再加一層*/
  align-items: center;
  /*垂直居中*/
  justify-content: center;
  /*水平居中*/
  text-align: center;
  letter-spacing: .1rem;
  font-size: 1.3rem;
  color: #fff;
  font-weight: bold;
  padding: 10px;
}
.tab_m {
  display: none;
  position: fixed;
  top: 0;
  background: #e05110;
  width: 100%;
  z-index: 100;
}
.tab_m .tab {
  height: 60px;
}
.tab_m .tab a {
  font-size: 1.1rem;
  line-height: 1.2;
}

.tab .t-1{
    border-radius: 50px;
    padding: 5px 52px;
    background-color: #fff5d4;
    border: solid 4px #ffbc0d;
    color: #e05110;
    font-size: 1.2em;
    font-weight: 600;
}
.tab .t-2{
    border-radius: 50px;
    padding: 2px 7px;
    background-color: #fff5d4;
    border: solid 3px #ffbc0d;
    color: #e05110;
    font-size: 1em;
    font-weight: 600;
}
.tab .t-1:hover{
  background-color: #ffbc0d;
}
.tab .t-2:hover{
  background-color: #ffbc0d;
}
@media (max-width: 970px) {
  .tab_pc{
    display: none;
  }
  .tab_m{
    display: block;
    padding: 0;
  }
}
/*------------kv------------*/
.kv_m{display: none;}
.kv{
  position: relative;
  display: block;
  margin: 50px auto;
  max-width: 907px;
  -webkit-animation: fadeInDown 1s ease-out;
  animation: fadeInDown 1s ease-out;
}
.kv_title_light{
  position: absolute;
  display: block;
  max-width: 100%;
  bottom: 12%;
  left: -.3%;
  z-index: 1;
  -webkit-animation: flash 1s infinite;
  animation: flash 1s infinite;
}
@-webkit-keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@keyframes fadeInDown {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}
@-webkit-keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}
@keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}
@media (max-width: 1024px) {
  .kv_m{display: block;}
  .kv_m img{
    max-width: 100%;
    width: 100%;
    display: block;
    margin: 0 auto;
  }
  .kv{display: none;}
}
/*------------content-tab------------*/
.tab_bar {
  width: 100%;
}
.tab_bar ul {
  margin-bottom: 0;
  display: flex;
}
.tab_bar ul li {
  width: 100%;
  border: none;
  outline: none;
  text-align: center;
  display: inline-block;
  background-color: #472292;
}
.tab_bar ul li:nth-child(1){border-radius: 1rem 0 0 0;}
.tab_bar ul li:nth-child(4){border-radius: 0 1rem 0 0;}
.tab_bar ul li a {
  line-height: 2.5;
  font-size: 1.3rem;
  font-weight: bold;
  color: #faf4df;
}
.tab_bar ul li.active{
  background-color: #faf4df;
}
.tab_bar ul li.active a{
  color: #472292;
}
@media (max-width: 500px) {
  .tab_bar {
    display: none;
  }
}
/*------------content-tab_m------------*/
.sticky.is-sticky {
  position: fixed;
  left: 0;
  right: 0;
  top: 60px;
  z-index: 1000;
  width: 100%;
}
.m_tab_bar {
  display: none;
  width: 100%;
  margin: 0 auto;
}
.m_tab_bar ul {
  margin-bottom: 0;
  display: flex;
}
.m_tab_bar ul li {
  width: 33.33%;
  border: none;
  outline: none;
  text-align: center;
  background-color: #472292;
  list-style: none;
  padding: 0.5rem 0;
}
.m_tab_bar ul li a {
  font-size: 1.1rem;
  font-weight: bold;
  color: #FFFFFF;
}
.m_tab_bar ul li.active {
  background-color: #faf4df;
}
.m_tab_bar ul li.active a{
  color: #472292;
}
@media (max-width: 500px) {
  .m_tab_bar {
    display: block;
    padding: 0;
  }
}
@media (max-width: 350px) {
  .tab_m .tab a {
    font-size: 0.9rem;
    padding: 0;
  }
}
/*------------content------------*/
.contentBox{
  background-color: #f0841a;
  background-size: auto,auto,auto,cover;
  padding: 3% 0 0 0;
}
.additem{
  background:
  url(../images/content_bg_topl.png) left 4% top 6% no-repeat,
  url(../images/content_bg_topr.png) right -5% top 3% no-repeat;
}
.contentBox_y{
  background-color: #fff5d4;
  background-size: auto,auto,auto,cover;
/*   padding: 3% 0; */
}
.contentBox_dy{
  background-color: #ffbc0d;
  padding: 3% 0;
}
.contentBox_or{
  background-color: #e05010 !important;
  padding: 3% 0 0 0;
}
.contentBox_yy{
  background-color: #fff5d4;
  background-size: auto,auto,auto,cover;
  padding: 3% 0;
}
.main-section{
  background-color: #f0841a;
}
.main-section h2 img{
  max-width: 100%;
  display: block;
  margin: 0 auto;
  padding: 0 0 2%;
}
.coupon {
  display: block;
  position: relative;
  padding: 20px 10px 0px 10px;
  max-width: 730px;
  margin: 0 auto;
}
.coupon img{
  display: block;
  margin: 60px auto 0;
  max-width: 100%;
}
.point .title img{
    display: block;
    margin: 0 auto 6%;
    max-width: 100%;
}
.cast img{
    max-width: 48em;
    display: block;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    width: 100%;
}
.item{
 /*  margin-bottom: 4%; */
}
.item img{
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

.item_btn:hover, .item_btn:focus, .item_btn:active {
  -webkit-transform: translateY(8px);
  transform: translateY(8px);
}
/* 背景裝飾白色線 */
.white-bg{
    background: url(../images/items-left.png) left repeat-y, url(../images/items-right.png) right repeat-y;
    background-size: 40vh;
}
.white-bg2{
    background: url(../images/items-left.png) left repeat-y, url(../images/items-right.png) right repeat-y;
    background-size: 30vh;
}

.point-img{
    max-width: 85%;
    margin: 0 auto;
    padding-bottom: 8%;
}
.photo{
  margin-bottom: 4%;
}
.photo img{
  max-width: 100%;
  display: block;
  margin: 0 auto;
}
.gift{
    max-width: 1000px;
    margin: 0 auto;
    display: block;
}
.gift img{
  max-width: 100%;
  display: block;
  margin: 0 auto;
}
.gift-title{
  max-width: 40em !important;
}

.bottom-img{
  background: url(../images/bg_bottom.png) no-repeat bottom center;
  padding-bottom: 0;
  background-size: contain;
}
.policyBox{
  
  }
.policy {
  font-size: 1.1em ;
  padding: 3% 5% 2%;
  margin: 0 auto;
  color: #333333;
  line-height: 1.6em;
  background: #fff ;
  border-radius:10px 10px 0 0;
  width: 100%;
}
.policy h2{
  text-align: center;
  font-size: 2.2em;
  font-weight: bold;
  color: #fff;
  padding-bottom: 4%;
}
.policy div{
  margin-bottom: 4%;
}
.policy h4 {
  font-weight: bold;
  font-size: 1.4em;
  padding-bottom: 1%;
  color: #e05010;
}
.policy p {
  font-size: 1.1em;
  padding-bottom: 3%;
 }
.policy ol li {
  margin: 0 0 0 1.2rem;
  line-height: 2em;
}
.policy img{
  display: block;
  width: 100%;
}
.google-map{
  position: relative;
  width: 100%;
}
.logoBox .policy{
  padding: 5% 2% 1%;
}
.map{
  margin-top: 4%;
}
.map img{
  display: block;
  position: relative;
  margin: 0 auto 8%;
  max-width: 100%;
}
.spon1{
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
}
.spon1 h4, .spon2 h4, .statement h4{
    font-weight: bold;
    font-size: 1.2em;
    padding-bottom: 1%;
    color: #e05010;
}
.statement p{
  font-size: 1em;
  padding-bottom: 3%;
  line-height: 25px;
}
.statement img{
  display: block;
  position: relative;
  max-width: 100%;
}
.spon1 img{
    display: block;
    margin: 0 2%;
    max-width: 200px;
}
.spon2 .policy{
  background-color: #fff5d4;
}
.spon2 .row{ 
  padding: 3% 2% 1%;
}
@media (max-width: 1200px){
   .cast img {
    max-width: 75%;
    position: relative;
    z-index: 1;
    bottom: 0;
    width: auto;
  }
  .additem {
    background: none;
  }

}
@media (min-width: 1200px) {


}
@media (max-width: 1024px) {
  .contentBox{
    /* background: url(../images/content_bg_botr.png) right -3% bottom no-repeat,
                url(../images/content_bg_topl.png) left 3% top 3% no-repeat,
                url(../images/content_bg_topr.png) right 5% top no-repeat,
                url(../images/content_bg.jpg) center bottom no-repeat; */
    background-color: #f0841a;
    background-size: auto,auto,auto,cover;
  }
  .contentBox_y{
    background-color: #fff5d4;
    background-size: auto,auto,auto,cover;
  }
  .main-section h2 img{
    padding: 0 0 8%;
  }
  .item_btn{
    width: 22%;
  }
  .item_btn2{
    width: 65%;
  }
  .show {
    max-width: 800px;
  }
  .cast img{

  }
  .white-bg,.white-bg2{
   background-image: none;
  }
}
@media (max-width: 990px){
    .stage{
    display: none !important;
  }
}
@media (min-width: 991px){
  .stage_m{
    display: none !important;
  }
}
@media (min-width: 768px) {
 .main-section h2 img{
    max-width: 54%;
  }
  .gift img ,.point .title img{
    max-width: 85%;
   }
  .gift .right-t{
    margin-left: 0 !important;
    margin-bottom: 6%;
  }
  .gift .left-t{
    margin-right: 0!important;
    margin-bottom: 4%;
  }
  .gift .right{
    margin-left: 2%;
  }
  .gift .left{
    margin-right: 2% ;
  }
  .show{
    max-width: 700px;
    display: block;
    margin: 0 auto;
  }
  .contentBox_y{
    padding-top: 1%;
/*     padding-bottom: 69px; */
  }
  .policy img {
    display: block;
    width: 100%;
    margin: 0 auto;
  }
  .gift-text-s{
    display: none !important;
    width: 100% !important;
  }

}
@media (max-width: 768px) {
  .contentBox{
    /* background: url(../images/content_bg_botr.png) right bottom no-repeat,
                url(../images/content_bg_topr.png) right 5% top no-repeat,
                url(../images/content_bg.jpg) center bottom no-repeat; */
    background-color: #f0841a;
    background-size: 20% auto,8% auto,cover;
  }
  .main-section h2 img{
    padding: 3% 0 8%;
  }
  .gift img {
    width: 100%;
  }  
  .gift .title{
    max-width: inherit; 
  }  
  .gift-text-s{
    width: 90% !important;
  }
  .gift .right-t{
    max-width: 270px !important;
    top: -30px;
    position: relative;
  }
  .gift .left, .gift .right{
    top: -34px;
    position: relative;
  }
  .gift-text{
    display: none !important;
  
  }
  .spon1 img {
      max-width: 140px;
  }
  .cast img {
      max-width: 100%;
      margin-top: 1em;
    }
  .policy {
      padding: 8% 5% 2%;
  }
  .policy p{
      padding-bottom: 5%;
  }
  .policy h4 {
      font-size: 1.3em;
      padding-bottom: 2%;
    }
} 
@media (max-width: 500px) {
  /* .contentBox{
    background: url(../images/content_bg_botr.png) right bottom no-repeat,
                url(../images/content_bg_topr.png) right 5% top no-repeat,
                url(../images/content_bg.jpg) center bottom no-repeat; */
    background-color: #f0841a;
    background-size: 20% auto,8% auto,cover;
  }
  .main-section h2 img{
    padding: 3% 0 2%;
  }
  .item_btn{
    width: 30%;
  }
  .item_btn2{
    width: 80%;
  }
  .gift .gift-title{
    width: 100% ;
  }
  .gift .left-t{
    max-width: 73%;
  }
  .gototicket img {
    width: 16vh !important;
  }
  .coupon img{
    margin: 20px auto 0;
  }


}
/*------------Policy------------*/

@media (max-width: 500px) {
  .policy{
    padding: 8% 6% 0;
    width: 100%;
}
  }
  .policy h2{
    font-size: 2em;
    padding-bottom: 6%;
  }
/*   */
  .policy ol li {
    font-size: 1.1rem;
    line-height: 1.6;
    margin: 0 0 0 1.5rem;
  }
  .google-map{
    display: flex;
  }
}
/*------------PID------------*/
.product .main-section h2 img {
    max-width: 100%;
    display: block;
    margin: 0 auto;
    padding: 0 0 3%;
}

@media (max-width: 500px) {
  .product .main-section h2 img {
    padding: 0 0 4%;
  }
}