@charset "UTF-8";
@import url(https:////fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url("https://fonts.googleapis.com/css?family=Cantata+One");
table {
  border-collapse: collapse;
  border-spacing: 0; }

fieldset, img {
  border: 0; }

address, caption, cite, code, dfn, em, strong, th, var, b {
  font-weight: normal;
  font-style: normal; }

ol, ul {
  list-style: none; }

caption, th {
  text-align: left; }

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  font-size: 100%; }

q:before, q:after {
  content: ""; }

abbr, acronym {
  border: 0; }

a {
  text-decoration: none; }

input, button, textarea, select, option {
  font-family: inherit;
  font-size: inherit;
  font-style: inherit;
  font-weight: inherit; }

textarea:focus, input:focus {
  outline: none; }

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
  box-sizing: border-box; }

body {
  line-height: 1.5;
  font-family: "Noto Sans TC", serif, sans-serif;
  font-size: 16px;
  color: #454545; }

.wrapper {
  width: 100%;
  margin: 0 auto;
  min-height: 100%;
  position: relative;
  overflow-x: hidden; }

.overlay {
  display: none; }
  .overlay__mask {
    opacity: 0.8;
    -moz-opacity: 0.8;
    filter: alpha(opacity=80);
    width: 100%;
    min-height: 110%;
    min-height: calc(100% + 35px);
    position: fixed;
    background: #000;
    z-index: 100;
    margin-top: -35px; }
  .overlay-box {
    position: fixed;
    position: fixed;
    width: 740px;
    height: 500px;
    top: 50%;
    left: 50%;
    margin-top: -250px;
    margin-left: -370px;
    z-index: 101; }
    .overlay-box__close {
      position: absolute;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: 2px solid #ffc8c8;
      top: 20px;
      right: 20px;
      z-index: 103;
      cursor: pointer;
      transition: all .25s ease-in; }
      .overlay-box__close span {
        display: block;
        background-color: #ffc8c8;
        width: 30px;
        height: 3px; }
        .overlay-box__close span:first-child {
          margin-top: 18px;
          margin-left: 5px;
          -webkit-transform: rotate(45deg);
                  transform: rotate(45deg); }
        .overlay-box__close span:last-child {
          -webkit-transform: rotate(-45deg);
                  transform: rotate(-45deg);
          margin-top: -2px;
          margin-left: 5px; }
      @media only screen and (min-width: 1281px) {
        .overlay-box__close:hover {
          background-color: #F14E4E;
          -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
          border-color: #fff; }
          .overlay-box__close:hover span {
            background-color: #fff; } }
    .overlay-box-loadPage {
      width: 100%;
      height: 100%;
      position: absolute;
      top: 0px;
      background-color: #ff6161;
      border-radius: 30px;
      padding: 20px 30px;
      box-sizing: border-box; }
      .overlay-box-loadPage #loadTitle {
        font-weight: 900;
        font-size: 36px;
        color: #fff;
        text-align: center;
        padding-top: 35px;
        background: transparent url("../img/recordsTitle.png") 50% top no-repeat;
        background-size: 54px 41px; }
      .overlay-box-loadPage #loadIframe {
        margin-top: 20px;
        width: 100%;
        height: 70%;
        height: calc(100% - 114px); }
    @media only screen and (max-width: 768px) {
      .overlay-box {
        width: 96%;
        margin-left: -48%; } }
    @media only screen and (max-width: 414px) {
      .overlay-box {
        height: 75%;
        top: 12%;
        margin-top: 0; }
        .overlay-box__close {
          top: 10px;
          right: 10px; }
        .overlay-box-loadPage {
          padding: 10px 20px;
          box-sizing: border-box; }
          .overlay-box-loadPage #loadTitle {
            padding-top: 38px;
            font-size: 30px; }
          .overlay-box-loadPage #loadIframe {
            margin-top: 10px;
            height: calc(100% - 100px); } }

.backtop {
  position: fixed;
  bottom: -40px;
  left: 50%;
  transition: all .25s ease-in;
  margin-left: -30px;
  width: 60px;
  height: 40px;
  border-radius: 5px;
  padding: 0 5px;
  box-sizing: border-box;
  line-height: 40px;
  background-color: #fff;
  z-index: 5;
  font-weight: 700;
  color: #fff;
  text-align: center;
  background-color: rgba(255, 68, 68, 0.75);
  cursor: pointer; }
  @media only screen and (max-width: 768px) {
    .backtop {
      display: none; } }

.links {
  position: fixed;
  right: 0px;
  top: 80px;
  z-index: 5; }
  .links-list {
    width: 145px;
    height: 280px;
    background: transparent url("../img/linkBg.png") left top no-repeat;
    box-sizing: border-box;
    padding-top: 88px; }
    .links-list li {
      width: 140px;
      font-size: 20px;
      padding: 6px 0 4px;
      text-align: center; }
      .links-list li a {
        color: #fff; }
      .links-list li:nth-child(1) a, .links-list li:nth-child(2) a {
        color: #fff4ba; }
      @media only screen and (min-width: 1281px) {
        .links-list li:hover {
          opacity: 0.9;
          -moz-opacity: 0.9;
          filter: alpha(opacity=90); } }
  @media only screen and (max-width: 768px) {
    .links {
      position: absolute;
      top: auto;
      right: auto; }
      .links-list {
        background: none; }
        .links-list li {
          position: fixed;
          margin: 0;
          padding: 0;
          background-color: #ff6161; }
        .links-list__01 {
          left: 0;
          bottom: 0;
          width: 100% !important;
          height: 50px !important;
          border-radius: 0 !important;
          font-size: 24px;
          line-height: 48px; }
        .links-list__02 {
          display: none; }
        .links-list__03, .links-list__04 {
          width: 40px !important;
          height: 40px !important;
          right: 2px;
          border-radius: 5px; }
          .links-list__03 a, .links-list__04 a {
            color: transparent !important; }
        .links-list__03 {
          background: url("../img/icon_fb.png") 50% 50% no-repeat;
          background-size: 80% auto;
          top: 10px; }
        .links-list__04 {
          background: url("../img/icon_baha.png") 50% 50% no-repeat;
          background-size: 80% auto;
          top: 54px; } }

.header {
  background: url("../img/topBG.jpg") 50% -35px no-repeat;
  width: 100%;
  height: 1045px;
  position: relative; }
  .header-wrap {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    max-width: 1366px; }
  .header-logo {
    width: 158px;
    height: 102px;
    background: url("../img/logo.png") 50% 50% no-repeat;
    background-size: 100%;
    position: absolute;
    top: 30px;
    left: 60px; }
    .header-logo a {
      width: 100%;
      height: 100%;
      display: block; }
  .header-btns {
    position: relative;
    top: 966px;
    text-align: center; }
    .header-btns li {
      display: inline-block;
      width: 290px;
      height: 68px;
      margin: 0 20px;
      background-size: 100%;
      transition: all .25s ease-in;
      cursor: pointer;
      background-size: 100% auto; }
    .header-btns__01 {
      background: url("../img/btn1.png") 50% 0% no-repeat; }
    .header-btns__02 {
      background: url("../img/btn2.png") 50% 0% no-repeat; }
    @media only screen and (min-width: 1281px) {
      .header-btns__01:hover {
        background: url("../img/btn1_hover.png") 50% 0% no-repeat; }
      .header-btns__02:hover {
        background: url("../img/btn2_hover.png") 50% 0% no-repeat; } }
  .header-shine__dot {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: absolute;
    background-color: #fff;
    /* FF3.6-15 */
    /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, white 0%, rgba(255, 255, 255, 0.99) 1%, rgba(255, 252, 231, 0) 82%, rgba(255, 251, 226, 0) 100%);
    /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#00fffbe2',GradientType=1 );
    /* IE6-9 fallback on horizontal gradient */ }
  .header-shine .dot01 {
    top: 436px;
    left: 164px;
    -webkit-animation: Shine 1s infinite linear alternate;
            animation: Shine 1s infinite linear alternate; }
  .header-shine .dot02 {
    top: 338px;
    left: 208px;
    -webkit-animation: Shine 1s infinite 0.3s linear alternate;
            animation: Shine 1s infinite 0.3s linear alternate; }
  .header-shine .dot03 {
    top: 250px;
    left: 270px;
    -webkit-animation: Shine 1s infinite 0.6s linear alternate;
            animation: Shine 1s infinite 0.6s linear alternate; }
  .header-shine .dot04 {
    top: 78px;
    left: 550px;
    -webkit-animation: Shine 1s infinite 0.6s linear alternate;
            animation: Shine 1s infinite 0.6s linear alternate; }
  .header-shine .dot05 {
    top: 74px;
    left: 652px;
    -webkit-animation: Shine 1s infinite 0.3s linear alternate;
            animation: Shine 1s infinite 0.3s linear alternate; }
  .header-shine .dot06 {
    top: 82px;
    left: 760px;
    -webkit-animation: Shine 1s infinite 0.6s linear alternate;
            animation: Shine 1s infinite 0.6s linear alternate; }
  .header-shine .dot07 {
    top: 114px;
    left: 862px;
    -webkit-animation: Shine 1s infinite 0.3s linear alternate;
            animation: Shine 1s infinite 0.3s linear alternate; }
  .header-shine .dot08 {
    top: 166px;
    left: 958px;
    -webkit-animation: Shine 1s infinite linear alternate;
            animation: Shine 1s infinite linear alternate; }
  .header-shine .dot09 {
    top: 324px;
    left: 1102px;
    -webkit-animation: Shine 1s infinite 0.3s linear alternate;
            animation: Shine 1s infinite 0.3s linear alternate; }
  .header-shine .dot10 {
    top: 422px;
    left: 1150px;
    -webkit-animation: Shine 1s infinite 0.6s linear alternate;
            animation: Shine 1s infinite 0.6s linear alternate; }
  @media only screen and (max-width: 1366px) {
    .header-shine {
      display: none; } }
  @media only screen and (max-width: 768px) {
    .header {
      background: #fffdf3 url("../img/topBG.jpg") 50% 0 no-repeat;
      background-size: 150% auto;
      height: 90vw; }
      .header-logo {
        top: 10px;
        left: 10px; }
      .header-btns {
        top: 80vw; }
        .header-btns li {
          width: 145px;
          height: 34px;
          margin: 0 5px;
          width: 45%;
          max-width: 290px;
          height: 11vw; } }
  @media only screen and (max-width: 414px) {
    .header-logo {
      width: 105px;
      height: 68px; } }

@-webkit-keyframes Shine {
  0% {
    opacity: 1;
    -webkit-filter: brightness(120%);
            filter: brightness(120%); }
  20% {
    opacity: 1;
    -webkit-filter: brightness(120%);
            filter: brightness(120%); }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }

@keyframes Shine {
  0% {
    opacity: 1;
    -webkit-filter: brightness(120%);
            filter: brightness(120%); }
  20% {
    opacity: 1;
    -webkit-filter: brightness(120%);
            filter: brightness(120%); }
  50% {
    opacity: 0; }
  100% {
    opacity: 0; } }

section {
  padding: 50px 10px;
  box-sizing: border-box;
  padding-bottom: 80px;
  text-align: center;
  position: relative; }
  section h2 {
    display: inline-block;
    padding-top: 68px;
    background: url("../img/titleEgg.png") 50% top no-repeat;
    background-size: 80px 71px;
    font-size: 54px;
    font-weight: 900;
    color: #ff6161;
    margin: 20px 0; }
  section h4 {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 5px;
    color: #69a9e5; }
  section .secWrap {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    max-width: 960px;
    z-index: 2; }
  @media only screen and (max-width: 1024px) {
    section {
      padding: 50px 10px;
      box-sizing: border-box; }
      section h2 {
        margin: 10px 0;
        font-size: 48px; } }
  @media only screen and (max-width: 414px) {
    section {
      padding: 30px 10px;
      box-sizing: border-box; }
      section h2 {
        font-size: 40px; } }

.howTo {
  background-color: #fffdf3; }
  .howTo .fzBig {
    font-size: 30px; }
    .howTo .fzBig strong {
      font-weight: 700; }
  .howTo__date {
    color: #fff;
    border-radius: 30px;
    padding: 3px 20px;
    box-sizing: border-box;
    font-size: 24px;
    background-color: #69a9e5; }
  .howTo__target {
    margin: 20px 0;
    font-size: 24px;
    padding: 3px 0;
    box-sizing: border-box;
    color: #69a9e5; }
  .howTo-step {
    text-align: left;
    font-size: 18px; }
    .howTo-step-01 {
      margin-bottom: 15px; }
    .howTo-step .fbBtn {
      display: inline-block;
      margin: 15px 0 15px 20px;
      -webkit-transform: scale(1.5);
      transform: scale(1.5); }
    .howTo-step__ol {
      font-family: 'Cantata One', serif;
      font-style: italic;
      font-size: 72px;
      color: #69a9e5;
      width: 130px;
      display: inline-block; }
    .howTo-step-txt {
      display: inline-block;
      width: calc(100% - 138px);
      vertical-align: middle; }
    .howTo-step_tb {
      padding: 10px 10px;
      box-sizing: border-box;
      border: 1px solid #acacac;
      background-color: #f7f5ed;
      text-align: center;
      margin-top: 20px; }
      .howTo-step_tb .tb__td {
        padding: 10px 0; }
      .howTo-step_tb .tb__th {
        padding: 3px 0;
        background-color: #69a9e5;
        font-size: 24px;
        color: #fff; }
    .howTo-step_ex h4 {
      margin-top: 20px; }
    .howTo-step_ex p {
      margin: 0 0 10px; }
      .howTo-step_ex p span {
        background-color: #69a9e5;
        color: #fff;
        margin-right: 10px; }
    .howTo-step_ex-ol {
      font-weight: 700;
      margin: 0;
      margin-bottom: 20px;
      padding-left: 20px; }
      .howTo-step_ex-ol li {
        list-style: square; }
  @media only screen and (max-width: 414px) {
    .howTo .fzBig {
      font-size: 21px; }
      .howTo .fzBig strong {
        font-weight: 700; }
    .howTo__date, .howTo__target {
      font-size: 18px; }
    .howTo-step {
      font-size: 16px; }
      .howTo-step-01 {
        margin-bottom: 30px; }
      .howTo-step .fbBtn {
        width: 100px;
        display: block;
        position: relative;
        margin: 15px auto; }
      .howTo-step__ol, .howTo-step-txt {
        width: 100%;
        display: block;
        text-align: center; }
      .howTo-step__ol {
        font-size: 48px; } }

.luckyWheel {
  background: url("../img/rotateBg.jpg") repeat; }
  .luckyWheel-time {
    font-size: 18px; }
  .luckyWheel-log {
    margin-top: 10px;
    font-size: 24px;
    color: #69a9e5; }
    .luckyWheel-log button {
      border: 0;
      border-radius: 5px;
      padding: 0 8px;
      box-sizing: border-box;
      padding-bottom: 2px;
      color: #fff;
      background-color: #69a9e5;
      box-shadow: inset 0 -4px 0 rgba(0, 0, 0, 0.2); }
      .luckyWheel-log button:active {
        color: #eee; }
  .luckyWheel-num {
    margin-top: 15px;
    padding: 3px 20px;
    box-sizing: border-box;
    font-size: 24px;
    background-color: rgba(0, 0, 0, 0.15);
    border-radius: 30px; }
    .luckyWheel-num span {
      font-weight: 900;
      color: #ff6161; }
  .luckyWheel-btns, .purchase-btns {
    margin-top: 20px;
    position: relative; }
    .luckyWheel-btns li, .purchase-btns li {
      display: inline-block;
      width: 214px;
      height: 68px;
      margin: 0 20px;
      background-size: 100%;
      transition: all .25s ease-in;
      cursor: pointer;
      background-size: 100% auto;
      text-indent: -9999px; }
    .luckyWheel-btns__01 {
      background: url("../img/btn3.png") 50% 0% no-repeat; }
    .luckyWheel-btns__02 {
      background: url("../img/btn4.png") 50% 0% no-repeat; }
    @media only screen and (min-width: 1281px) {
      .luckyWheel-btns__01:hover {
        background: url("../img/btn3_hover.png") 50% 0% no-repeat; }
      .luckyWheel-btns__02:hover {
        background: url("../img/btn4_hover.png") 50% 0% no-repeat; } }
  .luckyWheel__ps {
    font-size: 14px;
    color: #a39d82; }
    .luckyWheel__ps ol {
      margin: 5px 0 0; }
      .luckyWheel__ps ol li {
        counter-increment: li;
        margin-bottom: 2px; }
        .luckyWheel__ps ol li:before {
          content: counter(li);
          font-family: 'Cantata One', serif;
          font-style: italic;
          display: inline-block;
          width: 24px;
          margin-left: -30px; }
        .luckyWheel__ps ol li span {
          font-weight: 700;
          text-decoration: underline;
          margin: 0 5px; }
  @media only screen and (max-width: 1024px) {
    .luckyWheel__ps {
      margin-top: 10px; } }
  @media only screen and (max-width: 768px) {
    .luckyWheel-btns li, .purchase-btns li {
      width: 145px;
      height: 34px;
      margin: 0 5px;
      width: 45%;
      max-width: 214px;
      height: 14vw; } }
  @media only screen and (max-width: 414px) {
    .luckyWheel-log, .luckyWheel-num {
      font-size: 18px; }
    .luckyWheel__ps {
      text-align: left; }
      .luckyWheel__ps ol {
        margin-left: -20px; }
        .luckyWheel__ps ol li:before {
          width: 15px;
          margin-left: -15px; } }

/***********************************************/
/* /////----- 轉盤主軸START -----/////*/
.luckyWheel-itemBox .mainWheel, .luckyWheel-itemBox .mainWheel .big-border, .luckyWheel-itemBox .mainWheel .small-border {
  position: relative;
  border-radius: 50%;
  box-sizing: border-box; }

.luckyWheel-itemBox {
  width: 100%;
  max-width: 820px;
  min-height: 100%;
  margin: 30px auto;
  position: relative; }
  .luckyWheel-itemBox .mainWheel {
    padding: 3%;
    max-width: 820px;
    max-height: 820px;
    width: 100%;
    background-color: #fff;
    z-index: 3;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); }
    .luckyWheel-itemBox .mainWheel .big-border {
      transition: all 2s cubic-bezier(1, 0.00001, 0.00001, 1);
      overflow: hidden; }
    .luckyWheel-itemBox .mainWheel .small-border {
      width: 100%;
      background-color: #eb7276; }
      .luckyWheel-itemBox .mainWheel .small-border:after {
        width: 75%;
        height: 75%;
        background-color: #e6e2d8;
        display: block;
        position: absolute;
        content: '';
        border-radius: 50%;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
                transform: translate(-50%, -50%);
        z-index: 3; }
    .luckyWheel-itemBox .mainWheel .start-btn {
      left: 25%;
      top: 25%;
      z-index: 100;
      transition: all 2s cubic-bezier(1, 0.00001, 0.00001, 1);
      width: 50%;
      height: 50%;
      background-image: url("../img/btn_start.png");
      background-size: 190px 196px;
      background-repeat: no-repeat;
      background-position: center 45%;
      cursor: pointer;
      position: absolute;
      text-indent: -9999px; }
      .luckyWheel-itemBox .mainWheel .start-btn.is--disable {
        cursor: inherit;
        background-image: url("../img/btn_start_disable.png"); }
    .luckyWheel-itemBox .mainWheel .itemBox9 .item {
      z-index: 4;
      width: 30%;
      height: 50%;
      padding: 20px 5px 0;
      box-sizing: border-box;
      position: absolute; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item:after {
        width: 1px;
        height: 104%;
        background-color: #f8f2e6;
        content: '';
        display: block;
        left: 50%;
        top: -10%;
        position: absolute;
        -webkit-transform: rotate(-19.6deg);
                transform: rotate(-19.6deg);
        -webkit-transform-origin: left bottom;
                transform-origin: left bottom; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item span {
        width: 100%;
        height: 30px;
        line-height: 1.2;
        display: block;
        color: #fff;
        font-size: 24px; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item-img {
        width: 70%;
        width: 100px;
        height: 100px;
        border-radius: 100px;
        overflow: hidden;
        position: relative;
        margin: 50px auto 0;
        background-color: #fff;
        overflow: hidden; }
        .luckyWheel-itemBox .mainWheel .itemBox9 .item-img img {
          width: 100%;
          height: auto; }
        .luckyWheel-itemBox .mainWheel .itemBox9 .item-img img {
          text-align: center;
          position: relative;
          top: 50%;
          left: 35%;
          width: 70%;
          -webkit-transform: translate(-50%, -50%);
                  transform: translate(-50%, -50%); }
  @media only screen and (max-width: 768px) {
    .luckyWheel-itemBox .mainWheel .start-btn {
      background-size: 60% auto; }
    .luckyWheel-itemBox .mainWheel .itemBox9 .item {
      padding-top: 5px; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item span {
        font-size: 16px; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item-img {
        margin: .75rem auto;
        width: 54px;
        height: 54px; }
        .luckyWheel-itemBox .mainWheel .itemBox9 .item-img img {
          left: 45%;
          width: 90%; } }
  @media only screen and (max-width: 414px) {
    .luckyWheel-itemBox {
      margin: 20px auto; }
      .luckyWheel-itemBox .mainWheel .small-border:after {
        background-color: transparent; }
      .luckyWheel-itemBox .mainWheel .itemBox9 .item-img {
        margin: .3rem auto;
        width: 40px;
        height: 40px; } }

.itemBox9 .item:nth-child(1) {
  -webkit-transform: rotate(30deg);
          transform: rotate(30deg); }

.itemBox9 .item:nth-child(2) {
  -webkit-transform: rotate(70deg);
          transform: rotate(70deg); }

.itemBox9 .item:nth-child(3) {
  -webkit-transform: rotate(110deg);
          transform: rotate(110deg); }

.itemBox9 .item:nth-child(4) {
  -webkit-transform: rotate(150deg);
          transform: rotate(150deg); }

.itemBox9 .item:nth-child(5) {
  -webkit-transform: rotate(190deg);
          transform: rotate(190deg); }

.itemBox9 .item:nth-child(6) {
  -webkit-transform: rotate(230deg);
          transform: rotate(230deg); }

.itemBox9 .item:nth-child(7) {
  -webkit-transform: rotate(270deg);
          transform: rotate(270deg); }

.itemBox9 .item:nth-child(8) {
  -webkit-transform: rotate(310deg);
          transform: rotate(310deg); }

.itemBox9 .item:nth-child(9) {
  -webkit-transform: rotate(350deg);
          transform: rotate(350deg); }

.itemBox9 .item:nth-of-type(1) {
  left: 46%;
  top: 7%; }

.itemBox9 .item:nth-of-type(2) {
  left: 55%;
  top: 18%; }

.itemBox9 .item:nth-of-type(3) {
  left: 55%;
  top: 33%; }

.itemBox9 .item:nth-of-type(4) {
  left: 46%;
  top: 44.5%; }

.itemBox9 .item:nth-of-type(5) {
  left: 31.5%;
  top: 47%; }

.itemBox9 .item:nth-of-type(6) {
  left: 18%;
  top: 40%; }

.itemBox9 .item:nth-of-type(7) {
  left: 13.2%;
  top: 25.4%; }

.itemBox9 .item:nth-of-type(8) {
  left: 17.5%;
  top: 11%; }

.itemBox9 .item:nth-of-type(9) {
  left: 31%;
  top: 4%; }

.swal2-content img {
  margin-top: 20px;
  margin-bottom: 20px; }

/* /////----- 轉盤主軸END -----/////*/
/***********************************************/
.purchase {
  background: url("../img/sendBg.jpg") repeat; }
  .purchase h4 {
    margin: 0 0 10px; }
  .purchase__date {
    border-radius: 30px;
    padding: 3px 20px;
    box-sizing: border-box;
    margin-bottom: 30px;
    font-size: 21px;
    background: #e8e5db; }
  .purchase .fzBig {
    font-size: 24px; }
    .purchase .fzBig strong {
      font-weight: 700; }
  .purchase_tb {
    padding: 10px 10px;
    box-sizing: border-box;
    border: 1px solid #acacac;
    background-color: #f7f5ed;
    width: 100%;
    font-weight: normal;
    font-size: 18px; }
    .purchase_tb table {
      width: 100%; }
      .purchase_tb table td, .purchase_tb table th {
        padding: 8px 10px;
        box-sizing: border-box;
        border: 2px solid #f7f5ed; }
      .purchase_tb table td img {
        border: 1px solid #bbb;
        width: 42px;
        height: auto;
        vertical-align: middle; }
      .purchase_tb table th {
        background-color: #69a9e5;
        font-size: 24px;
        text-align: center;
        color: #fff; }
  .purchase__ps {
    font-size: 14px;
    margin: 20px 0 30px;
    font-weight: 700; }
  .purchase-btns__01 {
    background: url("../img/btn5.png") 50% 0% no-repeat; }
  .purchase-btns__02 {
    background: url("../img/btn6.png") 50% 0% no-repeat; }
  @media only screen and (min-width: 1281px) {
    .purchase-btns__01:hover {
      background: url("../img/btn5_hover.png") 50% 0% no-repeat; }
    .purchase-btns__02:hover {
      background: url("../img/btn6_hover.png") 50% 0% no-repeat; } }
  .purchase-Soyga {
    background-color: #e8e5db;
    font-size: 14px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
    padding: 15px 25px;
    box-sizing: border-box;
    margin-top: 50px;
    text-align: left;
    max-width: 580px; }
    .purchase-Soyga h5 {
      font-weight: 700;
      font-size: 18px;
      margin: 0 0 10px;
      text-align: center; }
    .purchase-Soyga ol {
      margin: 0 0 0 20px;
      padding: 0; }
      .purchase-Soyga ol li:before {
        display: inline-block;
        content: '--';
        margin-left: -20px;
        padding-right: 6px; }
    .purchase-Soyga_attribute {
      margin-top: 10px; }
  @media only screen and (max-width: 768px) {
    .purchase-btns li {
      width: 145px;
      height: 34px;
      margin: 0 5px;
      width: 45%;
      max-width: 214px;
      height: 14vw; } }
  @media only screen and (max-width: 414px) {
    .purchase .fzBig {
      font-size: 21px; }
      .purchase .fzBig strong {
        font-weight: 700; }
    .purchase_tb {
      padding: 5px 5px;
      box-sizing: border-box;
      font-size: 16px; }
      .purchase_tb table th {
        font-size: 18px; }
    .purchase-Soyga {
      padding: 10px 10px;
      box-sizing: border-box;
      margin-top: 30px; } }

.notice {
  background: linear-gradient(#d6d889, #adb66e); }
  .notice:after {
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    opacity: 0.6;
    background: url("../img/noticeBG.png") repeat; }
  .notice-list {
    list-style: none;
    counter-reset: li;
    margin: 0; }
    .notice-list li {
      text-align: left;
      font-size: 18px;
      counter-increment: li;
      margin-bottom: 10px;
      line-height: 1.33; }
      .notice-list li a {
        color: #ff6161;
        font-weight: 700; }
      .notice-list li .strong {
        font-weight: 700; }
      .notice-list li:before {
        content: counter(li);
        font-family: 'Cantata One', serif;
        font-size: 20px;
        font-style: italic;
        display: inline-block;
        color: #fff;
        background-color: #69a9e5;
        text-align: center;
        border-radius: 30px;
        width: 30px;
        height: 30px;
        line-height: 30px;
        margin-left: -30px;
        margin-right: 2px; }
    .notice-list_ex {
      font-weight: 700;
      margin: 0;
      padding: 0; }
  @media only screen and (max-width: 768px) {
    .notice-list {
      margin-left: -10px; } }
  @media only screen and (max-width: 414px) {
    .notice-list li {
      text-align: justify;
      font-size: 16px; }
      .notice-list li:before {
        width: 24px;
        height: 24px;
        font-size: 16px;
        line-height: 24px; } }

div[class^=pic_] {
  z-index: 2;
  position: absolute; }
  div[class^=pic_] img {
    width: 100%; }

.impt {
  color: #ff6161 !important;
  background-color: transparent !important;
  margin: 0 !important; }

.pic_egg {
  width: 290px;
  bottom: 0px;
  right: calc((100% - 960px) / 2 - 290px); }

.pic_ch01 {
  width: 390px;
  height: 639px;
  bottom: 120px;
  left: -30%; }

.pic_ch02 {
  width: 393px;
  height: 618px;
  bottom: 120px;
  right: -24%; }

@media only screen and (max-width: 1024px) {
  .pic_egg {
    position: relative !important;
    bottom: auto;
    right: auto;
    margin: 0 auto; }
  .pic_ch01, .pic_ch02 {
    position: relative !important;
    bottom: auto; }
  .pic_ch01 {
    width: 245px;
    height: 320px;
    left: 0;
    margin: 0 auto;
    display: inline-block; }
  .pic_ch02 {
    width: 247px;
    height: 309px;
    right: 0;
    margin: 0 auto;
    display: inline-block; } }

@media only screen and (max-width: 414px) {
  .pic_egg {
    width: 50%; }
  .pic_ch01, .pic_ch02 {
    width: 45%;
    height: 70vw; } }

/*# sourceMappingURL=common.css.map */