* {
  user-select: none;
  padding: 0;
  margin: 0 auto;
  font-family: Taipei Sans TC, sans-serif !important;
  box-sizing: border-box
}

:root {
  --webColorMain: #203666;
  --webColorHighlight: #F57F25;
  --lightBgColor: #F5F5F5;
  --lightFontColor: #898989;
  --FontColor: #333333;
  --TitleColor: #00A0C3;
  --BtnColor: #FFFFFF;
  --Highlight: #DC4136;
  --CounterColor: #F8B62B;
  --InputTitle: #1B2852;
  --CardBackground: #FFF2E4;
  background: var(--BtnColor);
  overflow-x: hidden
}

.big_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 17px;
  font-weight: 700;
  color: var(--webColorMain)
}

.small_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  font-weight: 700;
  color: var(--TitleColor)
}

.input_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  font-weight: 700;
  line-height: 14px;
  color: var(--InputTitle)
}

.copyright {
  font-family: 'Taipei Sans TC Beta';
  font-size: 8px;
  font-weight: 400;
  line-height: 14px;
  text-align: center
}

.modal_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 20px;
  font-weight: 700 !important;
  color: var(--TitleColor)
}

.modal_small_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 18px;
  font-weight: 700;
  color: var(--InputTitle)
}

.modal_text {
  font-family: 'Taipei Sans TC Beta';
  font-size: 16px;
  font-weight: 400;
  color: var(--InputTitle);
  text-align: justify
}

.footer_text {
  font-family: 'Taipei Sans TC Beta';
  font-size: 12px;
  font-weight: 400
}

.thank_text {
  font-family: 'Taipei Sans TC Beta';
  font-size: 26px;
  font-weight: 700;
  color: var(--Highlight)
}

.radio_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 15px;
  font-weight: 700;
  line-height: 19px
}

.radio_text {
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  font-weight: 400;
  line-height: 19px
}

input {
  font-family: 'Taipei Sans TC Beta';
  font-size: 12px;
  font-weight: 400;
  color: var(--FontColor)
}

.counter-num {
  font-family: 'Taipei Sans TC Beta';
  font-size: 19px;
  font-weight: 700;
  line-height: 19px
}

.counter-text {
  font-family: 'Taipei Sans TC Beta';
  font-size: 12px;
  font-weight: 400;
  line-height: 12px
}

.description_title {
  font-family: 'Taipei Sans TC Beta';
  font-size: 16px;
  font-weight: 700;
  line-height: 12px
}

.description {
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  line-height: 15px
}

a:link,
h a {
  text-decoration: none
}

body,
h1,
ul {
  margin: 0
}

ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0 !important
}

body {
  background: var(--BtnColor)
}

.col-gray {
  color: var(--lightFontColor)
}

.col-black {
  color: #000
}

.col-darkgray {
  color: var(--FontColor) !important
}

.col-white {
  color: #fff !important
}

.col-ligray {
  color: var(--lightFontColor)
}

.col-md-white {
  color: #fff
}

.col-red {
  color: var(--Highlight)
}

.col-main {
  opacity: 1;
  color: var(--webColorMain)
}

.col-yellow {
  color: var(--CounterColor) !important
}

.col-lightblue {
  color: var(--TitleColor)
}

.col-blue {
  color: var(--webColorMain) !important
}

.bule-bg {
  background: var(--InputTitle)
}

button {
  border: none
}

nav {
  background: var(--BtnColor);
  overflow: hidden;
  border-radius: 2.5%;
  border-bottom: 1px solid var(--BorderColor);
  position: fixed;
  width: 100%;
  z-index: 1000;
  box-shadow: 0 4px 15px 0 #00000040
}

#nav {
  box-shadow: 0 4px 15px rgba(0, 0, 0, .25)
}

nav::after {
  content: "";
  display: block;
  clear: both
}

nav .navbar-brands {
  float: left;
  line-height: 50px;
  padding-left: 1rem
}

.w-30 {
  width: 30%
}

.w-45 {
  width: 45%
}

.w-60 {
  width: 60%
}

.w-65 {
  width: 65%
}

.w-85 {
  width: 85%
}

.w-90 {
  width: 90%
}

.w-md-75 {
  width: 75%
}

.line-height-nonrmal {
  line-height: normal !important
}

.line-height-little {
  line-height: 25px !important
}

.double-line {
  border: 3.5px solid var(--TitleColor);
  border-radius: 10px;
  position: relative;
  background-color: var(--BtnColor)
}

.double-line::after {
  content: '';
  border: 3px solid var(--CounterColor);
  border-radius: 8px;
  position: absolute;
  left: -10px;
  top: 12px;
  width: 100%;
  height: 100%;
  display: block
}

.double-line-spancing {
  padding: 80px 65px 40px 25px
}

@media screen and (min-width:1200px) {
  .radio_title {
    font-size: 24px !important;
    line-height: 30px !important
  }

  .big_title {
    font-family: 'Taipei Sans TC Beta';
    font-weight: 700;
    font-size: 34px;
    line-height: 50px
  }

  .small_title {
    font-family: 'Taipei Sans TC Beta';
    font-weight: 700;
    font-size: 26px;
    line-height: 50px
  }

  .input_title {
    font-family: 'Taipei Sans TC Beta';
    font-size: 18px;
    font-weight: 700;
    line-height: 18px
  }

  input {
    font-size: 12px;
    font-weight: 400;
    color: var(--FontColor)
  }

  .index-video {
    height: 100vh !important
  }

  .counter-num {
    font-family: 'Taipei Sans TC Beta';
    font-size: 35px;
    font-weight: 700;
    line-height: 50px
  }

  .description_title {
    font-size: 20px !important;
    line-height: 20px !important
  }

  .description {
    font-size: 16px !important;
    line-height: 23px !important
  }

  .counter-text {
    font-family: 'Taipei Sans TC Beta';
    font-size: 16px;
    font-weight: 400;
    line-height: 25px
  }

  .menu li a {
    font-size: 18px !important;
    line-height: 18px !important;
    padding: 10px 20px !important
  }

  .pl-15ps {
    padding-left: 15% !important
  }

  .pl-md-6rem {
    padding: 0 !important
  }

  .hr-main-2 {
    border: 2px solid var(--webColorMain);
    margin: 100px auto !important
  }

  .w-md-75 {
    width: 100% !important
  }

  .discount-line {
    left: -40px !important
  }

  .left-border {
    border-left: none !important;
    border: var(--lightBorderColor) 3px solid;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: 0 10px 10px 0
  }

  .nav-spacing {
    height: 89px !important
  }
}

@media screen and (min-width:992px) {
  /*.embed-responsive {
    height: 100vh !important
  }*/

  .max-width {
    max-width: 1120px !important
  }

  .thank_text {
    font-size: 35px !important
  }

  form label {
    font-size: 20px !important
  }

  .good-bg {
    top: 44% !important;
    right: 25% !important
  }

  .px-200 {
    padding: 0 200px !important
  }

  .radio_title {
    font-family: 'Taipei Sans TC Beta';
    font-size: 15px;
    font-weight: 700;
    line-height: 19px
  }

  .drinkcard-cc {
    height: 315px !important;
    width: 95% !important
  }

  .double-line-spancing-2 {
    border-radius: 10px !important
  }

  .form-control {
    padding: .375rem .75rem !important
  }

  .pl-lg-0 {
    padding-left: 0 !important
  }

  .pl-lg-1 {
    padding-left: .25rem !important
  }

  .pl-lg-2 {
    padding-left: .5rem !important
  }

  .pl-lg-3 {
    padding-left: 1rem !important
  }

  .pl-lg-4 {
    padding-left: 1.5rem !important
  }

  .pl-lg-5 {
    padding-left: 3rem !important
  }

  .pr-lg-1 {
    padding-right: .25rem !important
  }

  .pr-lg-2 {
    padding-right: .5rem !important
  }

  .pr-lg-3 {
    padding-right: 1rem !important
  }

  .pr-lg-4 {
    padding-right: 1.5rem !important
  }

  .pr-lg-5 {
    padding-right: 3rem !important
  }

  .ml-lg-0 {
    margin-left: 0 !important
  }

  .ml-lg-1 {
    margin-left: .25rem !important
  }

  .ml-lg-2 {
    margin-left: .5rem !important
  }

  .ml-lg-3 {
    margin-left: 1rem !important
  }

  .ml-lg-4 {
    margin-left: 1.5rem !important
  }

  .ml-lg-5 {
    margin-left: 3rem !important
  }

  .mr-lg-0 {
    margin-left: 0 !important
  }

  .mr-lg-1 {
    margin-right: .25rem !important
  }

  .mr-lg-2 {
    margin-right: .5rem !important
  }

  .mr-lg-3 {
    margin-right: 1rem !important
  }

  .mr-lg-4 {
    margin-right: 1.5rem !important
  }

  .mr-lg-5 {
    margin-right: 3rem !important
  }

  .back-top {
    bottom: 5px !important;
    right: 5px !important;
    width: 60px !important;
    height: 60px !important;
    border-radius: 12px !important
  }

  .counter-line {
    border-right: 1px solid rgba(255, 255, 255, .5) !important
  }

  .logo_size {
    width: 85% !important
  }

  .position-lg-relative {
    position: relative
  }

  .pl-lg-0 {
    padding-left: 0 !important
  }

  .pl-lg-1 {
    padding-left: .25rem !important
  }

  .pl-lg-2 {
    padding-left: .5rem !important
  }

  .pl-lg-3 {
    padding-left: 1rem !important
  }

  .pl-lg-4 {
    padding-left: 1.5rem !important
  }

  .pl-lg-5 {
    padding-left: 3rem !important
  }

  .pr-lg-1 {
    padding-right: .25rem !important
  }

  .pr-lg-2 {
    padding-right: .5rem !important
  }

  .pr-lg-3 {
    padding-right: 1rem !important
  }

  .pr-lg-4 {
    padding-right: 1.5rem !important
  }

  .pr-lg-5 {
    padding-right: 3rem !important
  }

  .double-line {
    border: 10px solid #7acad3;
    border-radius: 25px;
    position: relative
  }

  .double-line::after {
    content: '';
    border: 5px solid #f8b62b;
    border-radius: 25px;
    position: absolute;
    left: -25px;
    top: 20px;
    width: 100%;
    height: 100%;
    display: block
  }

  nav {
    border-radius: 0;
    box-shadow: 0 4px 15px 0 #00000040
  }

  .pt-120 {
    padding-top: 120px !important
  }

  .pb-120 {
    padding-bottom: 120px !important
  }

  .py-120 {
    padding: 120px 0 !important
  }

  .py-150 {
    padding: 150px 0 !important
  }

  .py-md-90 {
    padding: 0 !important
  }

  .px-md-10ps {
    padding: 0 !important
  }

  .pl-10ps {
    padding-left: 10% !important
  }

  .pl-20ps {
    padding-left: 20% !important
  }

  .pr-10ps {
    padding-right: 10% !important
  }

  .pr-20ps {
    padding-right: 20% !important
  }

  .pl-40ps {
    padding-left: 40% !important
  }

  .mx-md-150ps {
    margin: 0 !important
  }

  .border-right {
    border-right: 2px solid #aaa !important
  }

  .double-line-spancing {
    padding: 100px 110px 40px 110px !important
  }

  .double-line-spancing-2 {
    padding: 110px 0 110px 0 !important;
    background: var(--BtnColor)
  }

  .container-MD {
    width: 100%;
    padding: 0 !important
  }
}

.menu {
  float: right;
  line-height: 50px;
  padding-right: 1rem
}

.menu li {
  display: inline-block;
  border-top: none
}

.menu li a:hover {
  color: var(--Highlight);
  font-weight: 700
}

.menu li a {
  padding: 8px 15px;
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  font-weight: 700;
  line-height: 14px
}

.nav-link {
  font-family: 'Taipei Sans TC Beta';
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  color: var(--FontColor)
}

.card {
  background: #fff;
  border: 1px solid var(--lightFontColor);
  border-radius: 10px
}

.card-border {
  border: 1px solid #c9c9c9;
  border-radius: 10px
}

.hr-main {
  border: 2px solid var(--webColorMain);
  margin: 20px auto;
  opacity: 1
}

.hr-main-2 {
  border: 2px solid var(--webColorMain);
  margin: 50px auto;
  width: 100px;
  opacity: 1
}

.hr-gray {
  border: 1px var(--BorderColor) solid
}

.text-justify {
  text-align: justify
}

.pill-border {
  border: 2px solid var(--Highlight);
  border-radius: 20px;
  padding: 10px 0
}

.pill {
  border-radius: 50px;
  background: var(--Highlight)
}

.left-border a:hover {
  color: var(--BtnColor)
}

.pt-120 {
  padding: 0
}

.pb-120 {
  padding-bottom: 0
}

.py-120 {
  padding: 0
}

.py-150 {
  padding: 100px 0 150px 0
}

.py-md-90 {
  padding: 90px 0
}

.px-md-10ps {
  padding: 0 10%
}

.pl-10ps {
  padding: 0
}

.pl-15ps {
  padding: 0
}

.pl-md-6rem {
  padding-left: 6rem
}

.pr-10ps {
  padding: 0
}

.pl-20ps {
  padding: 0
}

.pr-25ps {
  padding: 0
}

.pl-40ps {
  padding: 0
}

.mx-md-15ps {
  margin: 0 15%
}

footer a:hover {
  color: var(--webColorMain);
  transition: ease-in-out .3s
}

.active {
  font-weight: 700;
  color: var(--webColorHighlight)
}

.border-left {
  border-left: 4px solid #fff
}

.border-right {
  border-right: none
}

.vertical-avg {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  flex-direction: column
}

.rotate-180 {
  transform: rotate(180deg)
}

.pl-1 {
  padding-left: .25rem
}

.pl-2 {
  padding-left: .5rem
}

.pl-3 {
  padding-left: 1rem
}

.pl-4 {
  padding-left: 1.5rem
}

.pl-5 {
  padding-left: 3rem
}

.pr-1 {
  padding-right: .25rem
}

.pr-2 {
  padding-right: .5rem
}

.pr-3 {
  padding-right: 1rem
}

.pr-4 {
  padding-right: 1.5rem
}

.pr-5 {
  padding-right: 3rem
}

.ml-1 {
  margin-left: .25rem
}

.ml-2 {
  margin-left: .5rem
}

.ml-3 {
  margin-left: 1rem
}

.ml-4 {
  margin-left: 1.5rem
}

.ml-5 {
  margin-left: 3rem
}

.mr-1 {
  margin-right: .25rem
}

.mr-2 {
  margin-right: .5rem
}

.mr-3 {
  margin-right: 1rem
}

.mr-4 {
  margin-right: 1.5rem
}

.mr-5 {
  margin-right: 3rem
}

.container-MD {
  width: 100%;
  padding-right: calc(var(--bs-gutter-x) * .5);
  padding-left: calc(var(--bs-gutter-x) * .5)
}

.logo_size {
  width: 65%
}

.join-btn {
  vertical-align: text-bottom;
  scale: .8
}

.border-x-none {
  border-right: none;
  border-left: none;
  border-radius: 0
}

.gutter-x {
  --bs-gutter-x: 0 !important
}

.index-video {
  height: 30vh
}

.counter-line {
  border-right: none
}

.description-block {
  background: #174788;
  border-radius: 5px;
  padding: 20px
}

.left-people {
  width: 120%;
  position: relative;
  left: -150px
}

.animation {
  animation: messageAnimation 6s ease infinite
}

@keyframes messageAnimation {
  0% {
    transform: translateY(25px)
  }

  25% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(20px)
  }

  75% {
    transform: translateY(0)
  }

  100% {
    transform: translateY(25px)
  }
}

.cloud-animation {
  animation: cloud-animation 3s ease
}

@keyframes cloud-animation {
  0% {
    transform: rotate(-10deg)
  }

  25% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-20px)
  }

  75% {
    transform: translateY(0)
  }

  100% {
    transform: rotate(-10deg)
  }
}

.cloud-animation-2 {
  animation: cloud-animation-2 3s ease
}

@keyframes cloud-animation-2 {
  0% {
    transform: rotate(10deg)
  }

  25% {
    transform: translateY(0)
  }

  50% {
    transform: translateY(-20px)
  }

  75% {
    transform: translateY(0)
  }

  100% {
    transform: rotate(10deg)
  }
}

.left-right {
  animation: left-right 2s
}

@keyframes left-right {
  0% {
    transform: translateX(-100%);
    opacity: 0
  }

  50% {
    opacity: 1;
    transform: translateX(0)
  }
}

.right-left {
  animation: right-left 2s
}

@keyframes right-left {
  0% {
    transform: translateX(100%);
    opacity: 0
  }

  50% {
    opacity: 1;
    transform: translateX(0)
  }
}

.top-bottom {
  animation: top-bottom 2s;
  opacity: 0;
  animation-delay: .5s;
  animation-fill-mode: forwards
}

@keyframes top-bottom {
  0% {
    transform: translateY(-100%);
    opacity: 0
  }

  50% {
    opacity: 1;
    transform: translateY(0)
  }

  100% {
    opacity: 1
  }
}

.back-top {
  z-index: 99999;
  position: fixed;
  bottom: 10px;
  right: 10px;
  cursor: pointer;
  filter: Alpha(opacity=50);
  width: 45px;
  height: 45px;
  background: var(--Highlight) center no-repeat url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+CjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4KCjxzdmcKICAgeG1sbnM6ZGM9Imh0dHA6Ly9wdXJsLm9yZy9kYy9lbGVtZW50cy8xLjEvIgogICB4bWxuczpjYz0iaHR0cDovL2NyZWF0aXZlY29tbW9ucy5vcmcvbnMjIgogICB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiCiAgIHhtbG5zOnN2Zz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciCiAgIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIKICAgeG1sbnM6c29kaXBvZGk9Imh0dHA6Ly9zb2RpcG9kaS5zb3VyY2Vmb3JnZS5uZXQvRFREL3NvZGlwb2RpLTAuZHRkIgogICB4bWxuczppbmtzY2FwZT0iaHR0cDovL3d3dy5pbmtzY2FwZS5vcmcvbmFtZXNwYWNlcy9pbmtzY2FwZSIKICAgdmVyc2lvbj0iMS4xIgogICBpZD0iQ2FwYV8xIgogICB4PSIwcHgiCiAgIHk9IjBweCIKICAgd2lkdGg9IjUxMnB4IgogICBoZWlnaHQ9IjUxMnB4IgogICB2aWV3Qm94PSIwIDAgNDUxLjg0NiA0NTEuODQ3IgogICBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA0NTEuODQ2IDQ1MS44NDc7IgogICB4bWw6c3BhY2U9InByZXNlcnZlIgogICBpbmtzY2FwZTp2ZXJzaW9uPSIwLjQ4LjUgcjEwMDQwIgogICBzb2RpcG9kaTpkb2NuYW1lPSJhcnJvdy1wb2ludC10by1yaWdodC5zdmciPjxtZXRhZGF0YQogICBpZD0ibWV0YWRhdGE0MSI+PHJkZjpSREY+PGNjOldvcmsKICAgICAgIHJkZjphYm91dD0iIj48ZGM6Zm9ybWF0PmltYWdlL3N2Zyt4bWw8L2RjOmZvcm1hdD48ZGM6dHlwZQogICAgICAgICByZGY6cmVzb3VyY2U9Imh0dHA6Ly9wdXJsLm9yZy9kYy9kY21pdHlwZS9TdGlsbEltYWdlIiAvPjwvY2M6V29yaz48L3JkZjpSREY+PC9tZXRhZGF0YT48ZGVmcwogICBpZD0iZGVmczM5IiAvPjxzb2RpcG9kaTpuYW1lZHZpZXcKICAgcGFnZWNvbG9yPSIjZmZmZmZmIgogICBib3JkZXJjb2xvcj0iIzY2NjY2NiIKICAgYm9yZGVyb3BhY2l0eT0iMSIKICAgb2JqZWN0dG9sZXJhbmNlPSIxMCIKICAgZ3JpZHRvbGVyYW5jZT0iMTAiCiAgIGd1aWRldG9sZXJhbmNlPSIxMCIKICAgaW5rc2NhcGU6cGFnZW9wYWNpdHk9IjAiCiAgIGlua3NjYXBlOnBhZ2VzaGFkb3c9IjIiCiAgIGlua3NjYXBlOndpbmRvdy13aWR0aD0iMTYwMCIKICAgaW5rc2NhcGU6d2luZG93LWhlaWdodD0iODM3IgogICBpZD0ibmFtZWR2aWV3MzciCiAgIHNob3dncmlkPSJmYWxzZSIKICAgaW5rc2NhcGU6em9vbT0iMC40NjA5Mzc1IgogICBpbmtzY2FwZTpjeD0iMjU2IgogICBpbmtzY2FwZTpjeT0iMjU2IgogICBpbmtzY2FwZTp3aW5kb3cteD0iLTgiCiAgIGlua3NjYXBlOndpbmRvdy15PSItOCIKICAgaW5rc2NhcGU6d2luZG93LW1heGltaXplZD0iMSIKICAgaW5rc2NhcGU6Y3VycmVudC1sYXllcj0iQ2FwYV8xIiAvPgo8ZwogICBpZD0iZzMiCiAgIHN0eWxlPSJmaWxsOiNmZmZmZmYiCiAgIHRyYW5zZm9ybT0ibWF0cml4KDAsLTEsLTEsMCw0NTEuODQ2NSw0NTEuODQ2NSkiPgoJPHBhdGgKICAgZD0iTSAzNDUuNDQxLDI0OC4yOTIgMTUxLjE1NCw0NDIuNTczIGMgLTEyLjM1OSwxMi4zNjUgLTMyLjM5NywxMi4zNjUgLTQ0Ljc1LDAgLTEyLjM1NCwtMTIuMzU0IC0xMi4zNTQsLTMyLjM5MSAwLC00NC43NDQgTCAyNzguMzE4LDIyNS45MiAxMDYuNDA5LDU0LjAxNyBjIC0xMi4zNTQsLTEyLjM1OSAtMTIuMzU0LC0zMi4zOTQgMCwtNDQuNzQ4IDEyLjM1NCwtMTIuMzU5IDMyLjM5MSwtMTIuMzU5IDQ0Ljc1LDAgbCAxOTQuMjg3LDE5NC4yODQgYyA2LjE3Nyw2LjE4IDkuMjYyLDE0LjI3MSA5LjI2MiwyMi4zNjYgMCw4LjA5OSAtMy4wOTEsMTYuMTk2IC05LjI2NywyMi4zNzMgeiIKICAgaWQ9InBhdGg1IgogICBzdHlsZT0iZmlsbDojZmZmZmZmIgogICBpbmtzY2FwZTpjb25uZWN0b3ItY3VydmF0dXJlPSIwIiAvPgo8L2c+CjxnCiAgIGlkPSJnNyI+CjwvZz4KPGcKICAgaWQ9Imc5Ij4KPC9nPgo8ZwogICBpZD0iZzExIj4KPC9nPgo8ZwogICBpZD0iZzEzIj4KPC9nPgo8ZwogICBpZD0iZzE1Ij4KPC9nPgo8ZwogICBpZD0iZzE3Ij4KPC9nPgo8ZwogICBpZD0iZzE5Ij4KPC9nPgo8ZwogICBpZD0iZzIxIj4KPC9nPgo8ZwogICBpZD0iZzIzIj4KPC9nPgo8ZwogICBpZD0iZzI1Ij4KPC9nPgo8ZwogICBpZD0iZzI3Ij4KPC9nPgo8ZwogICBpZD0iZzI5Ij4KPC9nPgo8ZwogICBpZD0iZzMxIj4KPC9nPgo8ZwogICBpZD0iZzMzIj4KPC9nPgo8ZwogICBpZD0iZzM1Ij4KPC9nPgo8L3N2Zz4=);
  background-size: 24px 24px;
  border-radius: 5px;
  transform: translateY(0);
  transition: all .2s linear
}

.back-top:hover {
  filter: Alpha(opacity=80);
  box-shadow: 0 0 6px #fff
}

.back-top.hide {
  opacity: 0;
  filter: Alpha(opacity=0);
  transform: translateY(150%)
}

.free-img-md-1 {
  position: absolute;
  top: 2.5%
}

.free-img-md-2 {
  position: absolute;
  right: 5%;
  top: 35%
}

.pt-100 {
  padding-top: 100px
}

.scale {
  animation: 1s scale infinite
}

@keyframes scale {
  0% {
    scale: 1
  }

  50% {
    scale: 1.05
  }
}

.cloud-md {
  position: absolute;
  bottom: -4.5%;
  scale: 1.25
}

.double-line-spancing-2 {
  background: var(--BtnColor);
  border-radius: 5px;
  padding-right: 10px
}

.card-radio {
  border: 1.5px solid var(--Highlight);
  background-color: var(--CardBackground);
  border-radius: 3px
}

.next-pill {
  border-radius: 50px;
  color: var(--BtnColor);
  width: 120px;
  background-color: var(--Highlight);
  font-family: 'Taipei Sans TC Beta';
  font-size: 14px;
  font-weight: 700;
  line-height: 12px
}

footer {
  background-color: var(--InputTitle)
}

.drinkcard-color {
  background: #fff2e4 !important
}

.drinkcard-cc {
  background: #f1f1f1;
  border: 3px solid #dc4136;
  border-radius: 3px;
  margin: .25rem;
  height: 160px
}

.nav-spacing {
  height: 50px
}

.z-index-999 {
  z-index: 999
}

.form-control {
  padding: .125rem .75rem;
  border: 1px solid var(--InputTitle) !important;
  border-radius: 5px;
  font-size: 14px;
  background-color: transparent
}

.form-control-bottom {
  border: none;
  border-bottom: 1px solid var(--InputTitle) !important;
  padding: .375rem 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.5;
  width: calc(100% - 13px);
  margin-left: 13px;
  background: 0 0
}

.form-select {
  padding: .125rem .75rem;
  border: 1px solid var(--InputTitle) !important;
  border-radius: 5px;
  background-color: transparent
}

.form-hr {
  overflow: hidden;
  text-align: center
}

form label {
  font-size: 14px
}

.free-img-lg-1 {
  position: absolute;
  top: 23%
}

.free-img-lg-2 {
  position: absolute;
  top: 1%;
  right: 24%
}

.good-bg {
  top: 40%;
  right: 18%
}

.sales-bg {
  top: 50%;
  right: 18%
}

.max-width {
  max-width: 920px
}

.modal_title {
  position: relative;
  right: -18px
}

/*.embed-responsive {
  height: 40vh
}*/

iframe {
  object-fit: cover;
  height: 100%;
  width: 100%
}