@charset "UTF-8";
.grid, .grid-1, .grid-2, .grid-3, .grid-4, .grid-5, .grid-6, .grid-7, .grid-8, .grid-9, .grid-10, .grid-11, .grid-12, .grid-auto, .grid-sm, .grid-sm-1, .grid-sm-2, .grid-sm-3, .grid-sm-4, .grid-sm-5, .grid-sm-6, .grid-sm-7, .grid-sm-8, .grid-sm-9, .grid-sm-10, .grid-sm-11, .grid-sm-12, .grid-md, .grid-md-1, .grid-md-2, .grid-md-3, .grid-md-4, .grid-md-5, .grid-md-6, .grid-md-7, .grid-md-8, .grid-md-9, .grid-md-10, .grid-md-11, .grid-md-12, .grid-lg, .grid-lg-1, .grid-lg-2, .grid-lg-3, .grid-lg-4, .grid-lg-5, .grid-lg-6, .grid-lg-7, .grid-lg-8, .grid-lg-9, .grid-lg-10, .grid-lg-11, .grid-lg-12, .grid-xl, .grid-xl-1, .grid-xl-2, .grid-xl-3, .grid-xl-4, .grid-xl-5, .grid-xl-6, .grid-xl-7, .grid-xl-8, .grid-xl-9, .grid-xl-10, .grid-xl-11, .grid-xl-12 {
  width: 100%;
  position: relative;
}

.grid-wrap {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.grid {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
  max-width: 100%;
}

.grid-auto {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  width: auto;
  max-width: 100%;
}

.grid-1 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 8.33333%;
          flex: 0 0 8.33333%;
  max-width: 8.33333%;
}

.grid-2 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 16.66667%;
          flex: 0 0 16.66667%;
  max-width: 16.66667%;
}

.grid-3 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 25%;
          flex: 0 0 25%;
  max-width: 25%;
}

.grid-4 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 33.33333%;
          flex: 0 0 33.33333%;
  max-width: 33.33333%;
}

.grid-5 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 41.66667%;
          flex: 0 0 41.66667%;
  max-width: 41.66667%;
}

.grid-6 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 50%;
          flex: 0 0 50%;
  max-width: 50%;
}

.grid-7 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 58.33333%;
          flex: 0 0 58.33333%;
  max-width: 58.33333%;
}

.grid-8 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 66.66667%;
          flex: 0 0 66.66667%;
  max-width: 66.66667%;
}

.grid-9 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 75%;
          flex: 0 0 75%;
  max-width: 75%;
}

.grid-10 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 83.33333%;
          flex: 0 0 83.33333%;
  max-width: 83.33333%;
}

.grid-11 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 91.66667%;
          flex: 0 0 91.66667%;
  max-width: 91.66667%;
}

.grid-12 {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 576px) {
  .grid-sm {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    max-width: 100%;
  }
  .grid-sm-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .grid-sm-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
  .grid-sm-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .grid-sm-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-sm-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .grid-sm-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }
  .grid-sm-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-sm-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }
  .grid-sm-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }
  .grid-sm-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-sm-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }
  .grid-sm-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }
  .grid-sm-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (min-width: 768px) {
  .grid-md {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    max-width: 100%;
  }
  .grid-md-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .grid-md-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
  .grid-md-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .grid-md-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-md-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .grid-md-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }
  .grid-md-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-md-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }
  .grid-md-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }
  .grid-md-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-md-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }
  .grid-md-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }
  .grid-md-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (min-width: 992px) {
  .grid-lg {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    max-width: 100%;
  }
  .grid-lg-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .grid-lg-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
  .grid-lg-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .grid-lg-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-lg-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .grid-lg-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }
  .grid-lg-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-lg-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }
  .grid-lg-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }
  .grid-lg-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-lg-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }
  .grid-lg-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }
  .grid-lg-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (min-width: 1200px) {
  .grid-xl {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    max-width: 100%;
  }
  .grid-xl-auto {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    width: auto;
    max-width: 100%;
  }
  .grid-xl-1 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 8.33333%;
            flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
  .grid-xl-2 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 16.66667%;
            flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .grid-xl-3 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
            flex: 0 0 25%;
    max-width: 25%;
  }
  .grid-xl-4 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 33.33333%;
            flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .grid-xl-5 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 41.66667%;
            flex: 0 0 41.66667%;
    max-width: 41.66667%;
  }
  .grid-xl-6 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
            flex: 0 0 50%;
    max-width: 50%;
  }
  .grid-xl-7 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 58.33333%;
            flex: 0 0 58.33333%;
    max-width: 58.33333%;
  }
  .grid-xl-8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 66.66667%;
            flex: 0 0 66.66667%;
    max-width: 66.66667%;
  }
  .grid-xl-9 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
            flex: 0 0 75%;
    max-width: 75%;
  }
  .grid-xl-10 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
            flex: 0 0 83.33333%;
    max-width: 83.33333%;
  }
  .grid-xl-11 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 91.66667%;
            flex: 0 0 91.66667%;
    max-width: 91.66667%;
  }
  .grid-xl-12 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

.radius-right-0 {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-right: 0;
}

.radius-left-0 {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  border-left: 0;
}

@media (min-width: 768px) {
  .font-xl {
    font-size: 46pt;
    font-weight: bold;
  }
  .font-lg {
    font-size: 40pt;
    font-weight: bold;
  }
  .font-h1 {
    font-size: 34pt;
    font-weight: bold;
  }
  .font-h2 {
    font-size: 32pt;
    font-weight: bold;
  }
  .font-h3 {
    font-size: 30pt;
    font-weight: bold;
  }
  .font-h4 {
    font-size: 26pt;
    font-weight: bold;
  }
  .font-h5 {
    font-size: 22pt;
    font-weight: bold;
  }
  .font-h6 {
    font-size: 18pt;
    font-weight: bold;
  }
  .font-mini {
    font-size: 90%;
  }
}

@media (max-width: 767px) {
  .font-xl {
    font-size: 42pt;
    font-weight: bold;
  }
  .font-lg {
    font-size: 36pt;
    font-weight: bold;
  }
  .font-h1 {
    font-size: 32pt;
    font-weight: bold;
  }
  .font-h2 {
    font-size: 30pt;
    font-weight: bold;
  }
  .font-h3 {
    font-size: 28pt;
    font-weight: bold;
  }
  .font-h4 {
    font-size: 24pt;
    font-weight: bold;
  }
  .font-h5 {
    font-size: 20pt;
    font-weight: bold;
  }
  .font-h6 {
    font-size: 16pt;
    font-weight: bold;
  }
  .font-mini {
    font-size: 80%;
  }
}

@media (max-width: 575px) {
  .font-xl {
    font-size: 38pt;
    font-weight: bold;
  }
  .font-lg {
    font-size: 32pt;
    font-weight: bold;
  }
  .font-h1 {
    font-size: 30pt;
    font-weight: bold;
  }
  .font-h2 {
    font-size: 28pt;
    font-weight: bold;
  }
  .font-h3 {
    font-size: 26pt;
    font-weight: bold;
  }
  .font-h4 {
    font-size: 22pt;
    font-weight: bold;
  }
  .font-h5 {
    font-size: 18pt;
    font-weight: bold;
  }
  .font-h6 {
    font-size: 14pt;
    font-weight: bold;
  }
}

.large-wrap, .small-wrap, .mini-wrap {
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

.large-wrap {
  width: 100%;
}

.small-wrap {
  width: 100%;
  max-width: 1280px;
}

.mini-wrap {
  width: 100%;
  max-width: 1024px;
}

.item-list .item-link .item-description .item-title h4, .item-list .item-link .item-description .item-title.grid-wrap > span, .item-list .item-link .info-header h4, .item-list .item-link .info-header span:not(.badge), .item-list .item-link .info-header.info-auto p, .item-list .item-link .info-header .item-info > p, .item-list .item-link .info-header .item-info > h4, #footer .footer-wrap .footer-link > * > a {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

::-webkit-scrollbar {
  width: 3px;
  height: 3px;
}

::-webkit-scrollbar-track {
  background-color: #fff;
}

::-webkit-scrollbar-track-piece {
  background-color: #ddd;
  border-radius: 5px;
}

::-webkit-scrollbar-track-piece:hover {
  background-color: #e6e6e6;
}

::-webkit-scrollbar-button {
  background-color: #000;
  display: none;
}

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  /* vertical-align: baseline; */
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}

body {
  line-height: 1;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

* {
  letter-spacing: 1px;
  font-family: Arial, '微軟正黑體' !important;
}

p, small, span, b, i, li {
  line-height: 1.4;
}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.4 !important;
}

a, a:hover, a:active, a:focus, a:visited {
  text-decoration: none !important;
}

a {
  -webkit-transition: background .25s ease-in-out, color .25s ease-in-out;
  transition: background .25s ease-in-out, color .25s ease-in-out;
}

.small, small {
  font-size: 80%;
  font-weight: 400;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .modal-title {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    -ms-flex-preferred-size: 0;
        flex-basis: 0;
    max-width: 100%;
  }
  .modal-body {
    height: 100%;
  }
}

.btn:not(:disabled):not(.disabled) {
  cursor: pointer;
}

span.btn.disabled {
  opacity: 1;
}

table {
  width: 100% !important;
}

.table-hover tbody tr {
  -webkit-transition: background .25s ease-in-out;
  transition: background .25s ease-in-out;
}

.table-item {
  width: 100%;
  overflow-x: auto;
}

.table-item::-webkit-scrollbar {
  height: 5px;
}

.table-item .table thead th {
  border-bottom: 1px solid transparent;
}

.table-item .table tbody tr:not(:last-child) {
  border-bottom: 1px solid transparent;
}

.table-item .table th, .table-item .table td {
  white-space: nowrap;
  vertical-align: middle;
}

.table-item .table .table-photo {
  width: 40px;
  height: 40px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

body {
  padding-top: 130px;
}

@media (max-width: 991px) {
  body {
    padding-top: 81px;
  }
}

@media (min-width: 992px) {
  .wrap-mask {
    display: none;
  }
}

@media (max-width: 991px) {
  .wrap-mask {
    position: fixed;
    top: 0;
    left: 0;
    opacity: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    background-color: rgba(0, 0, 0, 0.5);
  }
  .wrap-mask.wrap-mask-active {
    opacity: 1;
    z-index: 150;
  }
}

@media (max-width: 991px) {
  .scroll-hide {
    overflow: hidden;
  }
}

.loading-wrap {
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
  position: fixed;
  -webkit-transform: scale(1);
          transform: scale(1);
  background-color: #ffffff;
  -webkit-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
}

.loading-wrap.move {
  opacity: 0;
  z-index: -1;
  -webkit-transform: scale(1.75);
          transform: scale(1.75);
}

.loading-wrap .load-detail, .loading-wrap .load-detail::after {
  top: 50%;
  left: 50%;
  border-radius: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}

.loading-wrap .load-detail {
  width: 50px;
  height: 50px;
  position: relative;
  background-color: #f3ad2b;
}

.loading-wrap .load-detail:after {
  content: '';
  position: absolute;
  -webkit-box-sizing: content-box;
          box-sizing: content-box;
  border: 0px solid #ffffff;
  -webkit-animation: load 1s ease-out forwards infinite;
          animation: load 1s ease-out forwards infinite;
}

@-webkit-keyframes load {
  0% {
    border: 0px solid #ffffff;
  }
  20% {
    width: 0;
    height: 0;
    border: 10px solid #ffffff;
  }
  100% {
    width: 100%;
    height: 100%;
    border: 10px solid #ffffff;
  }
}

@keyframes load {
  0% {
    border: 0px solid #ffffff;
  }
  20% {
    width: 0;
    height: 0;
    border: 10px solid #ffffff;
  }
  100% {
    width: 100%;
    height: 100%;
    border: 10px solid #ffffff;
  }
}

.slide-box {
  position: relative;
}

.slide-box .slide {
  width: 80%;
  margin: 0 auto;
}

@media (max-width: 991px) {
  .slide-box .slide {
    width: 100%;
  }
}

.slide-box .carousel-item {
  width: 100%;
  height: 700px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 991px) {
  .slide-box .carousel-item {
    height: 50vh;
  }
}

@media (max-width: 767px) {
  .slide-box .carousel-item {
    height: 350px;
  }
}

.slide-box .carousel-item > div {
  width: 100%;
  height: 100%;
  background-position: center !important;
  background-size: cover !important;
}

.home-list {
  padding: 4rem 0;
  position: relative;
}

.home-list:last-child {
  padding-bottom: 6rem;
}

.home-list .main-title h4 {
  color: #f3ad2b;
  padding-bottom: 4rem;
  text-align: center;
}

#prev-button, #next-button {
  border: 0;
  outline: 0;
  cursor: pointer;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
  font-size: 2rem;
  position: absolute;
  top: 6rem;
  z-index: 2;
  background: transparent;
}

#prev-button:hover, #next-button:hover {
  opacity: .5;
}

@media (max-width: 991px) {
  #prev-button, #next-button {
    display: none;
  }
}

#prev-button {
  left: 0rem;
}

#next-button {
  right: 0rem;
}

@media (min-width: 992px) {
  .news-owl {
    padding: 0 3rem;
  }
}

.home-description {
  position: relative;
  overflow: hidden;
}

.home-description a {
  font-size: 12pt;
  position: relative;
}

.home-description a:hover {
  -webkit-animation: btn_move 1s linear infinite;
          animation: btn_move 1s linear infinite;
}

.home-description::before {
  content: '';
  width: 700px;
  height: 700px;
  position: absolute;
  background-color: rgba(255, 255, 255, 0.1);
  -webkit-transform: rotate(60deg);
          transform: rotate(60deg);
  left: -350px;
  top: -280px;
}

.home-description .description-list .description-detail {
  position: relative;
}

.home-description .description-list .description-detail h4, .home-description .description-list .description-detail > p {
  color: #ffffff;
}

@media (min-width: 768px) {
  .home-description .description-list .description-detail {
    padding: 5rem 3rem;
  }
  .home-description .description-list .description-detail .description-title {
    top: calc(20px - 4rem);
    left: 55px;
  }
  .home-description .description-list .description-detail .description-title::after {
    content: '';
    display: block;
    width: 50%;
    height: 5px;
    margin: 0 auto;
  }
  .home-description .description-list .description-detail > p {
    padding-left: 160px;
  }
  .home-description .description-list .description-detail::before, .home-description .description-list .description-detail .description-title {
    position: absolute;
    padding-left: 1.5rem;
  }
  .home-description .description-list .description-detail::before {
    left: 0;
    content: '';
    top: calc(-160px - 4rem);
    width: 500px;
    height: 250px;
    -webkit-transform: rotate(150deg);
            transform: rotate(150deg);
  }
}

@-webkit-keyframes btn_move {
  0%, 100% {
    left: 0%;
  }
  50% {
    left: 10px;
  }
}

@keyframes btn_move {
  0%, 100% {
    left: 0%;
  }
  50% {
    left: 10px;
  }
}

.home-service .service-wrap {
  position: relative;
  z-index: 1;
  padding: 3rem;
}

@media (max-width: 767px) {
  .home-service .service-wrap {
    padding: 2rem;
  }
}

@media (max-width: 575px) {
  .home-service .service-wrap {
    padding: 1rem;
  }
}

.home-service .service-wrap .main-title h4 {
  position: relative;
}

.home-service .service-wrap .main-title h4::before, .home-service .service-wrap .main-title h4::after {
  content: '';
  width: calc(50% - 80px);
  border-bottom: 2px #f3ad2b dashed;
  display: inline-block;
  position: absolute;
  top: 1.5rem;
}

.home-service .service-wrap .main-title h4::before {
  left: 0;
}

.home-service .service-wrap .main-title h4::after {
  right: 0;
}

.home-service .service-wrap .feature {
  padding: 1.5rem 0;
}

.home-service .service-wrap .feature .grid-wrap > div {
  padding: 0 3rem 4rem 3rem;
}

@media (max-width: 767px) {
  .home-service .service-wrap .feature .grid-wrap > div {
    padding: 1rem;
  }
}

@media (max-width: 575px) {
  .home-service .service-wrap .feature .grid-wrap > div {
    padding: 1rem;
  }
}

.home-service .service-wrap .feature .grid-wrap > div p.title {
  font-size: 1.25rem;
  font-weight: bold;
}

@media (max-width: 575px) {
  .home-service .service-wrap .feature .grid-wrap > div p.title {
    font-size: 1.1rem;
  }
}

.home-service .service-wrap .feature .grid-wrap > div p.content {
  line-height: 1.6;
  letter-spacing: .3rem;
  text-align: left;
}

.home-service .service-wrap .feature .grid-wrap > div:not(:last-child) {
  border-right: 1px #f3ad2b solid;
}

@media (max-width: 767px) {
  .home-service .service-wrap .feature .grid-wrap > div:not(:last-child) {
    border-right: 0;
  }
}

@media (max-width: 767px) {
  .home-service .service-wrap .feature .grid-wrap {
    border: 1px #f3ad2b solid;
    border-radius: 5px;
    background-color: rgba(255, 255, 255, 0.8);
    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  }
  .home-service .service-wrap .feature .grid-wrap > .grid-md-4 {
    background: #f3ad2b;
    color: #ffffff;
  }
  .home-service .service-wrap .feature .grid-wrap:not(:last-child) {
    margin-bottom: 1rem;
  }
}

.home-service .service-wrap button {
  padding-left: 2rem;
  padding-right: 2rem;
}

.hot-owl .owl-stage-outer {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.home-hot {
  overflow: hidden;
}

.home-hot::before {
  content: ' ';
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 50px 50vw 0 50vw;
  position: absolute;
  top: -1px;
}

.home-hot .main-title h4 {
  padding-top: 5rem;
}

.item-wrap {
  margin-bottom: 1.5rem;
}

.item-list .item-link {
  display: block;
  overflow: hidden;
  position: relative;
  color: #1a1a1a;
}

.item-list .item-link .item-description {
  padding: 1rem;
}

@media (max-width: 575px) {
  .item-list .item-link {
    padding: .75rem;
  }
}

.item-list .item-link .item-picture {
  position: relative;
  padding-bottom: 75%;
}

.item-list .item-link .item-picture img {
  width: auto !important;
  max-width: 100%;
  max-height: 100%;
  position: absolute;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  top: 50%;
  left: 50%;
}

.item-list .item-link .hot-item {
  top: -13px;
  left: -80px;
  width: 200px;
  color: #ffffff;
  padding: 2rem .5rem .5rem .5rem;
  font-weight: bold;
  text-align: center;
  position: absolute;
  -webkit-transform: rotateZ(-45deg);
          transform: rotateZ(-45deg);
  z-index: 1;
}

.item-list .item-link .item-description .item-title {
  font-weight: bold;
}

.item-list .item-link .item-description .item-title h4 {
  width: 100%;
  font-size: 1.1rem;
  padding: .6rem 0;
  text-align: center;
}

@media (max-width: 575px) {
  .item-list .item-link .item-description .item-title h4 {
    font-size: 1rem;
  }
}

.item-list .item-link .item-description .item-title.grid-wrap {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.item-list .item-link .item-description .item-title.grid-wrap > h4 {
  text-align: left;
  padding-right: .5rem;
  width: calc(100% - 60px);
}

.item-list .item-link .item-description .item-title.grid-wrap > span {
  text-align: right;
  font-size: 95%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 60px;
          flex: 0 0 60px;
  max-width: 60px;
  color: #88c93b;
}

.item-list .item-link .item-description .item-title.grid-wrap ~ .item-info .info-header {
  text-align: justify;
}

.item-list .item-link .item-description .item-title.grid-wrap ~ .item-info .info-header::before {
  margin: 0;
}

.item-list .item-link .info-header {
  position: relative;
  color: #333333;
}

.item-list .item-link .info-header h4, .item-list .item-link .info-header span:not(.badge) {
  display: block;
}

.item-list .item-link .info-header:not(.info-auto) p {
  height: 72px;
  font-size: 95%;
  overflow: hidden;
  line-height: 24px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  word-wrap: break-word;
  word-break: break-all;
}

.item-list .item-link .info-header.info-auto {
  margin-top: .5rem;
}

.item-list .item-link .info-header .item-info {
  margin: 0 1rem;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  overflow: hidden;
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
}

.news-list .item-title, .news-list .item-info {
  text-align: center;
}

.news-owl .item {
  padding-left: 1.5rem;
}

.news-owl .item .item-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  background-color: transparent;
}

.news-owl .item .item-link:hover .item-info p, .news-owl .item .item-link:hover .item-info h4, .news-owl .item .item-link:hover .item-info span:not(.badge) {
  color: #f3ad2b !important;
}

.news-owl .item .item-link .circle-photo {
  padding-bottom: 1rem;
}

.news-owl .item .item-link .item-info, .news-owl .item .item-link .circle-photo {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}

@media (min-width: 992px) {
  .news-owl .item .item-link .item-info {
    padding-bottom: 0;
    padding-left: .5rem;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc(100% - 250px);
            flex: 0 0 calc(100% - 250px);
    max-width: calc(100% - 250px);
  }
}

.news-owl .item .item-info {
  color: #000000;
}

.news-owl .item .item-info span:first-of-type {
  font-size: 1.3rem;
}

.news-owl .item .item-info .badge {
  font-size: 1rem;
  border-radius: 0;
}

.news-owl .item .item-info p {
  color: #595959;
}

.news-owl .item .item-info h4 {
  font-weight: bold;
  font-size: 1.5rem;
  margin: .75rem 0;
}

.home-picture {
  padding-bottom: 0 !important;
}

.home-picture .main-title {
  position: relative;
}

.home-picture .main-title h4 {
  position: absolute;
  top: 3rem;
  z-index: 2;
  left: 50%;
  -webkit-transform: translate(-50%, 0);
          transform: translate(-50%, 0);
  color: #ffffff;
}

.home-picture .main-title h4::after {
  content: ' ';
  display: block;
  width: 70%;
  height: 1px;
  margin: 0 auto;
  background-color: #ffffff;
}

@media (max-width: 991px) {
  .home-picture .main-title h4 {
    position: relative;
    top: 0;
    left: 0;
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
    color: #f3ad2b;
  }
  .home-picture .main-title h4::after {
    width: 214px;
    background-color: #f3ad2b;
  }
}

.home-picture .grid-wrap {
  height: 60vh;
  overflow: hidden;
}

@media (max-width: 991px) {
  .home-picture .grid-wrap {
    height: 90vh;
  }
}

.home-picture .grid-wrap > div {
  position: relative;
  -webkit-transform: scale(1);
          transform: scale(1);
  cursor: pointer;
  -webkit-transition: -webkit-transform .4s;
  transition: -webkit-transform .4s;
  transition: transform .4s;
  transition: transform .4s, -webkit-transform .4s;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.home-picture .grid-wrap > div:hover {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
  z-index: 1;
}

.home-picture .grid-wrap > div:hover::before {
  opacity: 1;
}

.home-picture .grid-wrap > div:hover::after {
  opacity: 0;
}

@media (max-width: 991px) {
  .home-picture .grid-wrap > div::before {
    opacity: 1 !important;
  }
  .home-picture .grid-wrap > div::after {
    opacity: 0;
  }
}

.home-picture .grid-wrap > div::before {
  color: #ffffff;
  position: absolute;
  z-index: 2;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
  font-size: 1.2rem;
  content: '前往相簿 > ';
  border-bottom: 1px #ffffff solid;
  text-shadow: 1px 1px 20px #000000;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  opacity: 0;
}

.home-picture .grid-wrap > div::after {
  position: absolute;
  -webkit-transition: opacity .4s;
  transition: opacity .4s;
  content: ' ';
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: rgba(0, 0, 0, 0.5);
}

.btn-up {
  z-index: -1;
  opacity: 0;
  right: 30px;
  bottom: 120px;
  position: fixed;
  cursor: pointer;
  padding: 5px 10px;
  border: 2px solid #fff;
  -webkit-transition: all .4s ease-in-out;
  transition: all .4s ease-in-out;
  width: 50px;
  height: 50px;
  border-radius: 100%;
}

.btn-up > svg {
  font-size: 2.2rem;
}

.btn-up.up-active {
  z-index: 10;
  opacity: .7;
}

.btn-up.up-active:hover {
  opacity: 1;
}

.generic-wrap .generic-sort, .generic-wrap .generic-detail {
  padding: 0 1rem;
}

@media (max-width: 575px) {
  .generic-wrap .generic-sort, .generic-wrap .generic-detail {
    padding: 0 15px;
  }
}

.generic-wrap .generic-detail:not(.no-sort) {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% - 250px);
          flex: 0 0 calc(100% - 250px);
  max-width: calc(100% - 250px);
}

.generic-wrap .generic-detail.no-sort {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 100%;
          flex: 0 0 100%;
  max-width: 100%;
}

.generic-wrap .generic-detail .detail-wrap {
  padding: 2rem;
  background-color: #ffffff;
  -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
          box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

@media (max-width: 767px) {
  .generic-wrap .generic-detail .detail-wrap {
    padding: 1rem;
  }
}

.generic-wrap .generic-detail .detail-wrap .generic-header {
  margin-bottom: 2rem;
}

.generic-wrap .generic-detail .detail-wrap .generic-header .minor-title {
  font-size: 1.6rem;
  margin-bottom: .5rem;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.generic-wrap .generic-detail .detail-wrap .generic-header .minor-title .font-h6 {
  position: relative;
}

.generic-wrap .generic-detail .detail-wrap .generic-header .minor-title .font-h6::before {
  content: '';
  height: 2px;
  width: 70px;
  bottom: -10px;
  position: absolute;
  background-color: #f3ad2b;
}

@media (max-width: 991px) {
  .generic-wrap .generic-detail .detail-wrap .generic-header .minor-title .font-h6 {
    padding-bottom: 1rem;
  }
  .generic-wrap .generic-detail .detail-wrap .generic-header .minor-title .font-h6::before {
    bottom: 9px;
  }
}

@media (max-width: 767px) {
  .generic-wrap .generic-detail .detail-wrap .generic-header .minor-title .font-h6 {
    margin-bottom: .25rem;
  }
}

.generic-wrap .generic-sort {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 250px;
          flex: 0 0 250px;
  max-width: 250px;
}

@media (max-width: 991px) {
  .generic-wrap .generic-sort {
    margin-bottom: 1rem;
  }
}

.generic-wrap .generic-sort .sort-wrap {
  -webkit-box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
          box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
}

.generic-wrap .generic-sort .sort-wrap .sort-btn {
  padding: 1rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  color: #ffffff;
  background-color: #f3ad2b;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

@media (max-width: 991px) {
  .generic-wrap .generic-sort .sort-wrap .sort-btn {
    padding: .75rem;
  }
}

.generic-wrap .generic-sort .sort-wrap .sort-btn .down-icon {
  text-align: center;
}

@media (max-width: 991px) {
  .generic-wrap .generic-sort .sort-wrap .sort-btn .down-icon {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 30px;
            flex: 0 0 30px;
    max-width: 30px;
  }
}

.generic-wrap .generic-sort .sort-wrap .sort-btn .down-icon svg {
  top: -2px;
  width: 1.5em;
  height: 1.5em;
  position: relative;
}

@media (min-width: 992px) {
  .generic-wrap .generic-sort .sort-wrap .sort-list {
    display: block !important;
  }
}

.generic-wrap .generic-sort .sort-wrap .sort-list li a {
  color: #000000;
  padding: .75rem 1rem;
  background-color: #ffffff;
}

.generic-wrap .generic-sort .sort-wrap .sort-list li:not(:last-child) a {
  border-bottom: 1px dotted darke(#ffffff, 20%);
}

.generic-wrap .generic-sort .sort-wrap .sort-list li:hover a, .generic-wrap .generic-sort .sort-wrap .sort-list li.active a {
  color: #000000;
  background-color: #dee2e6;
}

@media (max-width: 991px) {
  .generic-wrap .generic-sort .sort-wrap .sort-btn {
    cursor: pointer;
    -webkit-transition: background-color .5s ease-in-out;
    transition: background-color .5s ease-in-out;
  }
  .generic-wrap .generic-sort .sort-wrap .sort-btn .down-icon {
    -webkit-transform: rotate(0);
            transform: rotate(0);
    -webkit-transition: -webkit-transform .5s ease-in-out;
    transition: -webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out;
    transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
  }
  .generic-wrap .generic-sort .sort-wrap .sort-btn.sort-show, .generic-wrap .generic-sort .sort-wrap .sort-btn:hover {
    background-color: #f6c05b;
  }
  .generic-wrap .generic-sort .sort-wrap .sort-btn.sort-show .down-icon {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
  .generic-wrap .generic-sort .sort-wrap .sort-list {
    display: none;
  }
}

@media (max-width: 991px) {
  .generic-wrap .generic-detail, .generic-wrap .generic-sort {
    -webkit-box-flex: 0 !important;
        -ms-flex: 0 0 100% !important;
            flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

.with-sort-wrap {
  width: 100%;
  max-width: 1530px;
  margin-left: auto;
  margin-right: auto;
}

.web-detail:not(.home-detail) {
  padding-bottom: 5rem;
}

.web-header {
  position: relative;
}

.web-header .title-photo {
  width: 100%;
  height: 350px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 767px) {
  .web-header .title-photo {
    height: 250px;
  }
}

@media (max-width: 575px) {
  .web-header .title-photo {
    height: 200px;
  }
}

.web-header .web-title {
  padding: .5rem;
  text-align: center;
  color: #ffffff;
}

.web-header::before {
  content: ' ';
  display: block;
  position: absolute;
  width: 100%;
  top: 0;
  bottom: 0;
  background-image: url("../images/bg/web-header-cover.png");
}

.breadcrumbs {
  padding: .5rem 0;
  margin-bottom: 3rem;
  background-color: #ffffff;
}

.breadcrumbs ul li {
  font-size: .85rem;
  display: inline-block;
  color: gray;
}

.breadcrumbs ul li a {
  color: gray;
}

.breadcrumbs ul li a:hover {
  color: #f3ad2b;
  font-weight: bold;
}

.breadcrumbs ul li:not(:last-child)::after {
  color: gray;
  content: '\f101';
  font-family: 'Font Awesome\ 5 Free';
  font-weight: bold;
  padding-left: .4rem;
}

.breadcrumbs ul li:last-child, .breadcrumbs ul li:last-child a {
  color: #f3ad2b;
  font-weight: bold;
}

.graphic-list {
  position: relative;
  padding: 2rem 0;
  color: #000000;
}

@media (max-width: 991px) {
  .graphic-list {
    padding: 1.5rem 15px;
  }
}

@media (max-width: 575px) {
  .graphic-list {
    padding: 0;
  }
}

.graphic-list > div {
  position: relative;
  z-index: 1;
  padding: 4rem 3rem;
}

@media (max-width: 991px) {
  .graphic-list > div {
    padding: 2rem 1rem;
  }
}

.graphic-list > div .graphic-photo {
  text-align: center;
  margin-right: -2rem;
}

@media (max-width: 991px) {
  .graphic-list > div .graphic-photo {
    margin-right: 0;
  }
}

.graphic-list > div .graphic-detail {
  padding: 0 1rem;
}

@media (max-width: 991px) {
  .graphic-list > div .graphic-detail {
    padding: 0 0 1rem 0;
  }
}

.graphic-list > div .graphic-detail .title {
  text-align: center;
  background: #ffffff;
  color: #f3ad2b;
  margin-right: -5rem;
  margin-left: 5rem;
  position: relative;
  z-index: 1;
  margin-bottom: 1rem;
  padding: 2rem;
}

@media (max-width: 991px) {
  .graphic-list > div .graphic-detail .title {
    margin-right: 0;
    margin-left: 0;
    padding: .5rem;
  }
}

.graphic-list > div .graphic-detail .content {
  position: relative;
  padding: 0 1rem;
}

.graphic-list > div .graphic-detail .content::before {
  content: ' ';
  display: block;
  top: -1rem;
  bottom: -1rem;
  left: -.5rem;
  width: 1px;
  position: absolute;
  background-color: #f3ad2b;
}

@media (max-width: 991px) {
  .graphic-list > div .graphic-detail .content::before {
    display: none;
  }
}

.graphic-list > div .graphic-detail .content::after {
  content: ' ';
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  border: 1px #f3ad2b solid;
  border-radius: 100%;
  top: calc(-1rem - 16px);
  left: -12px;
}

@media (max-width: 991px) {
  .graphic-list > div .graphic-detail .content::after {
    display: none;
  }
}

.main-sort select {
  background-color: #f3ad2b;
  color: #ffffff;
}

.main-sort select:focus {
  color: #ffffff;
  border: 2px solid #f6c05b;
  background-color: #f6c05b;
}

.main-sort select:focus option {
  background-color: #ffffff;
  color: #000000;
}

.graphic-list-2 {
  position: relative;
  height: 50vh;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 991px) {
  .graphic-list-2 {
    padding: 2rem 15px;
  }
}

@media (max-width: 575px) {
  .graphic-list-2 {
    padding: 0;
  }
}

.graphic-list-2 > div .graphic-detail .title {
  position: absolute;
  top: 50%;
  left: 50%;
  color: #ffffff;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  text-shadow: 1px 1px 6px #000000;
}

.title-content {
  padding: 5em 15px;
}

@media (max-width: 575px) {
  .title-content {
    padding: 2em 0;
  }
}

.title-content p.title {
  color: #f3ad2b;
  padding-bottom: 2rem;
}

.title-content p.content {
  margin: 0 auto;
  text-align: left;
  font-size: 1.2rem;
  letter-spacing: .3rem;
  position: relative;
  padding: 0 2rem;
}

@media (max-width: 991px) {
  .title-content p.content {
    font-size: 1rem;
    letter-spacing: .15rem;
  }
}

@media (max-width: 575px) {
  .title-content p.content {
    padding: 0;
  }
}

.title-content p.content::before {
  content: ' ';
  display: block;
  top: 0rem;
  bottom: -.5rem;
  left: .5rem;
  width: 1px;
  position: absolute;
  background-color: #f3ad2b;
}

@media (max-width: 575px) {
  .title-content p.content::before {
    display: none;
  }
}

.title-content p.content::after {
  content: ' ';
  display: block;
  width: 10px;
  height: 10px;
  position: absolute;
  border: 1px #f3ad2b solid;
  border-radius: 100%;
  top: -16px;
  left: 3px;
}

@media (max-width: 575px) {
  .title-content p.content::after {
    display: none;
  }
}

.modal .modal-content {
  border: 3px #595959 solid;
}

.modal .modal-content .modal-header button {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  font-size: 2rem;
  background: #ffffff;
  color: #000000;
  padding: 0;
  border-radius: 100%;
  border: 2px #ffffff solid;
  opacity: 1;
}

.album-modal {
  overflow-y: auto;
}

.album-modal .album-surface {
  position: relative;
}

.album-modal .album-surface > img {
  opacity: 0;
}

.album-modal .album-surface .album-inside-list {
  top: 0;
  left: 0;
  opacity: 0;
  z-index: 0;
  width: 100%;
  position: absolute;
  -webkit-transition: opacity .4s ease-in-out;
  transition: opacity .4s ease-in-out;
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .album-modal .album-surface .album-inside-list {
    width: 100%;
  }
}

.album-modal .album-surface .album-inside-list.album-show {
  z-index: 1;
  opacity: 1;
}

.album-modal .left-btn, .album-modal .right-btn {
  top: 50%;
  z-index: 10;
  cursor: pointer;
  font-size: 2.5rem;
  position: fixed;
  color: #ffffff;
  opacity: .8;
  -webkit-transform: translateY(-50%) scale(1);
          transform: translateY(-50%) scale(1);
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

.album-modal .left-btn > svg, .album-modal .right-btn > svg {
  width: 1.5em;
  height: 1.5em;
  font-size: 2rem;
  position: relative;
}

.album-modal .left-btn:hover, .album-modal .right-btn:hover {
  -webkit-transform: translateY(-50%) scale(1.2);
          transform: translateY(-50%) scale(1.2);
  opacity: 1;
}

.album-modal .left-btn {
  left: 15px;
}

.album-modal .right-btn {
  right: 15px;
}

.album-modal .modal-footer {
  position: relative;
  z-index: 1;
}

.album-list .item-title h4 {
  text-align: left !important;
}

.album-list .item-title h4::after {
  content: ' ';
  display: block;
  width: 20%;
  height: 2px;
  margin-top: .5rem;
  background-color: #88c93b;
}

.item-hover {
  cursor: pointer;
  background-color: #ffffff;
  -webkit-transition: all .7s ease-in-out;
  transition: all .7s ease-in-out;
}

.item-hover:hover {
  background-color: #ededed;
  -webkit-box-shadow: 0 0 0 0 #ededed, inset 3rem 2rem 0 0 #ededed;
          box-shadow: 0 0 0 0 #ededed, inset 3rem 2rem 0 0 #ededed;
}

.border-main {
  border: 2px #f3ad2b solid;
}

.btn-outline-main {
  color: #f3ad2b;
  border: 1px #f3ad2b solid;
  border-radius: 0;
  padding: .25rem 1rem;
  margin-bottom: 1rem;
  -webkit-transition: all .3s;
  transition: all .3s;
}

.btn-outline-main:hover {
  background-color: #f3ad2b;
  color: #ffffff;
}

.progeneric-detail .product-title-outer {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: start;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
}

.progeneric-detail .product-title-outer .product-title {
  color: #f3ad2b;
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% - 85px);
          flex: 0 0 calc(100% - 85px);
  max-width: calc(100% - 85px);
  word-wrap: break-word;
  word-break: break-all;
}

@media (max-width: 991px) {
  .progeneric-detail .product-title-outer .product-title {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
    -webkit-box-ordinal-group: 12;
        -ms-flex-order: 11;
            order: 11;
  }
}

.progeneric-detail .product-title-outer .product-title > * {
  display: inline-block;
}

.progeneric-detail .product-title-outer .product-title::before {
  content: '【';
}

.progeneric-detail .product-title-outer .product-title::after {
  content: '】';
}

.progeneric-detail .product-title-outer .renturn {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 85;
          flex: 0 0 85;
  max-width: 85px;
  text-align: right;
}

@media (max-width: 991px) {
  .progeneric-detail .product-title-outer .renturn {
    display: none;
  }
}

.progeneric-detail .product-title-outer::after {
  content: ' ';
  display: block;
  width: 90%;
  margin-left: 10%;
  border-bottom: 1px #f3ad2b dashed;
}

@media (max-width: 991px) {
  .progeneric-detail .product-title-outer::after {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
}

@media (max-width: 767px) {
  .progeneric-detail .product-title-outer::after {
    width: 100%;
    margin-left: 0;
  }
}

.progeneric-detail > h2 {
  border-bottom: 2px #000 solid;
  margin-bottom: 1rem;
  padding-bottom: 0 !important;
}

.progeneric-detail > *:not(:last-child) {
  padding-bottom: 1rem;
}

.progeneric-detail .proitem-share > * {
  padding-right: .5rem;
}

.progeneric-detail .proitem-kind > * {
  padding-right: .25rem;
  padding-bottom: .25rem;
  margin-bottom: .25rem;
}

.progeneric-detail .proitem-kind .kind-list {
  cursor: pointer;
  -o-object-fit: cover;
     object-fit: cover;
  border: 2px solid transparent;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
  padding: 3px 8px;
  border-color: #d9d9d9;
  display: inline-block;
}

.progeneric-detail .proitem-kind .kind-list:hover, .progeneric-detail .proitem-kind .kind-list.kind-active {
  border-color: #f3ad2b;
}

.progeneric-detail .proitem-num {
  line-height: 1.4;
}

.progeneric-detail .share-wrap > div:nth-child(1) {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}

.progeneric-detail .share-wrap > div:nth-child(2) svg {
  font-size: 1.5rem;
  color: #333333;
  -webkit-transition: color .3s;
  transition: color .3s;
}

.progeneric-detail .share-wrap > div:nth-child(2) svg:hover {
  color: #000000;
}

.proitem-main {
  overflow: hidden;
}

.proitem-main .main-photo {
  position: relative;
}

.proitem-main .main-photo .main-list {
  top: 0;
  left: 50%;
  opacity: 0;
  width: 100%;
  z-index: -1;
  position: absolute;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  -webkit-transition: opacity .3s ease-in-out;
  transition: opacity .3s ease-in-out;
  cursor: pointer;
}

.proitem-main .main-photo .main-list.main-active {
  z-index: 1;
  opacity: 1;
}

.proitem-minor .owl-dots {
  position: absolute;
  bottom: -3px;
}

.proitem-minor .item {
  cursor: pointer;
  -webkit-transition: opacity .3s;
  transition: opacity .3s;
}

.proitem-minor .item:hover {
  opacity: .8;
}

.proitem-content {
  padding: 3rem;
  background-color: #ffffff;
  border-top: 1px #f3ad2b dashed;
}

@media (max-width: 575px) {
  .proitem-content {
    padding: 1rem;
  }
}

.proitem-content .proitem-list:not(:last-child) {
  margin-bottom: 3rem;
}

.proitem-content .proitem-list p {
  margin-top: 1rem;
}

.proitem-content .minor-title h4 {
  text-align: center;
  color: #f3ad2b;
}

.proitem-content .minor-title h4::before {
  content: '【';
}

.proitem-content .minor-title h4::after {
  content: '】';
}

.slider .proitem-minor {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% - 220px);
          flex: 0 0 calc(100% - 220px);
  max-width: calc(100% - 220px);
}

@media (max-width: 991px) {
  .slider .proitem-minor {
    width: 100%;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

@media (max-width: 767px) {
  .slider .proitem-minor .owl-stage-outer {
    background-color: #e6e6e6;
  }
  .slider .proitem-minor .owl-item {
    padding: 1rem 0;
  }
}

.expand-wrap .expand-line {
  position: relative;
  padding-bottom: .25rem;
}

.expand-wrap .expand-line::before {
  top: 0;
  content: '';
  height: 100%;
  position: absolute;
  margin-left: .5rem;
  border-left: 2px solid #d9d9d9;
}

.expand-wrap .expand-line .expand-list .expand-title {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  cursor: pointer;
  padding: .5rem 0;
  font-weight: bold;
  font-size: 1.05rem;
  color: #8c8c8c;
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

.expand-wrap .expand-line .expand-list .expand-title > h5 {
  max-width: calc(100% - 30px);
}

.expand-wrap .expand-line .expand-list .expand-title::before {
  left: 0;
  top: 7px;
  content: '';
  width: 10px;
  height: 10px;
  margin: 0 .25rem;
  position: relative;
  border-radius: 100%;
  display: inline-block;
  border: 2px solid #ffffff;
  background-color: #8c8c8c;
  -webkit-transition: background-color .2s ease-in-out;
  transition: background-color .2s ease-in-out;
}

.expand-wrap .expand-line .expand-list:hover .expand-title, .expand-wrap .expand-line .expand-list.active .expand-title {
  color: #f3ad2b;
  font-weight: bold;
}

.expand-wrap .expand-line .expand-list:hover .expand-title::before, .expand-wrap .expand-line .expand-list.active .expand-title::before {
  background-color: #f3ad2b;
}

.expand-wrap .expand-line .expand-list .expand-content {
  display: none;
  position: relative;
  padding: 0 0 .5rem 1.5rem;
}

.expand-wrap .expand-line .expand-list:first-child .expand-content {
  display: block;
}

.form-control {
  border: 1px solid #f3ad2b;
}

.form-control:focus {
  border-color: #f8d28c;
  -webkit-box-shadow: 0 0 0 0.2rem rgba(243, 173, 43, 0.25);
          box-shadow: 0 0 0 0.2rem rgba(243, 173, 43, 0.25);
}

.form-control::-webkit-input-placeholder {
  color: #000000;
}

.form-control::-moz-placeholder {
  color: #000000;
}

.form-control::-ms-input-placeholder {
  color: #000000;
}

.contact-form {
  overflow: hidden;
}

@media (max-width: 991px) {
  .contact-form > .row > *:not(:last-child) {
    margin-bottom: 3rem;
  }
}

@media (max-width: 991px) {
  .contact-form .ver-wrap > *:not(:last-child) {
    margin-bottom: 1rem;
  }
}

.contact-form .contact-title > h4 {
  position: relative;
}

.contact-form .contact-title > h4::before {
  content: '';
  bottom: -5px;
  height: 3px;
  width: 100px;
  position: absolute;
  background-color: #000000;
}

.contact-form .contact-data .hexagon {
  position: relative;
  width: 45px;
  height: 45px;
  background-color: #f3ad2b;
  margin: 11.54px 0;
  border-radius: 10px;
}

.contact-form .contact-data .hexagon svg {
  font-size: 1.3rem;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  color: #ffffff;
}

.contact-form .contact-data .contact-detail {
  width: 100%;
  padding: .5rem;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc( 100% - 60px);
          flex: 0 0 calc( 100% - 60px);
  max-width: calc( 100% - 60px);
}

@media (max-width: 575px) {
  .contact-form .contact-data .contact-detail {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 calc( 100% - 50px);
            flex: 0 0 calc( 100% - 50px);
    max-width: calc( 100% - 50px);
  }
}

.contact-form .contact-data > .grid-wrap a {
  color: #000000;
  word-break: break-all;
}

.contact-form .contact-data > .grid-wrap:not(:last-child) {
  padding-bottom: 2rem;
}

.news-detail-wrap .news-header {
  border-left: 3px #f3ad2b solid;
  padding: 0 1rem;
}

.news-detail-wrap .news-header .date-style {
  color: #f3ad2b;
}

.news-detail-wrap .news-header .grid-wrap > *:not(:last-child) {
  margin-right: .5rem;
}

.news-detail-wrap .news-header .grid-wrap svg {
  font-size: 1.6rem;
  color: #404040;
  -webkit-transition: color .3s;
  transition: color .3s;
}

.news-detail-wrap .news-header .grid-wrap svg:hover {
  color: #000000;
}

.news-detail-wrap .news-header .grid-wrap button {
  margin: 0.25rem;
}

.news-detail-wrap .news-header .minor-title {
  color: #f3ad2b;
}

.news-detail-wrap .news-header .minor-title::before {
  content: ' ';
  display: block;
  width: 98%;
  margin: 1rem 0 1rem 2%;
  border-bottom: 1px #f3ad2b dashed;
}

.news-detail-wrap .news-detail {
  padding: 2rem;
}

@media (max-width: 575px) {
  .news-detail-wrap .news-detail {
    padding: 1rem 0;
  }
}

.news-detail-wrap .news-detail .news-article {
  text-align: justify;
}

.news-detail-wrap .news-detail .news-article > *:not(:last-child) {
  margin-bottom: 1.5rem;
}

.news-detail-wrap .news-detail .news-article img {
  display: block;
}

.sitemap-wrap .sitemap-detail > .grid-wrap > * {
  margin-bottom: 2rem;
}

.sitemap-wrap .sitemap-detail .sitemap-list a {
  color: #404040;
}

.sitemap-wrap .sitemap-detail .sitemap-list a > span {
  display: inline-block;
}

.sitemap-wrap .sitemap-detail .sitemap-list a:hover {
  color: #f3ad2b;
}

.sitemap-wrap .sitemap-detail .sitemap-list h6 {
  font-size: 1.4rem;
  padding-bottom: .75rem;
  border-bottom: 2px dotted #595959;
}

.sitemap-wrap .sitemap-detail .sitemap-list h6::before {
  content: '\f054';
  color: #f3ad2b;
  display: inline-block;
  font-family: 'Font Awesome\ 5 Free';
  font-weight: bold;
}

.sitemap-wrap .sitemap-detail .sitemap-list h6 a {
  display: inline-block;
}

.sitemap-wrap .sitemap-detail .sitemap-list > *:not(:last-child) {
  margin-bottom: 1rem;
}

.sitemap-wrap .sitemap-detail .sitemap-list li:not(:last-child) {
  margin-bottom: .5rem;
}

.terms-list {
  width: 100%;
}

.terms-list:not(:last-child) {
  margin-bottom: 2rem;
}

.terms-list h4 {
  color: #f3ad2b;
  border-left: 8px #f3ad2b solid;
  padding-left: 1rem;
  margin-bottom: 1rem;
}

.btn-community[title="facebook"] {
  color: #ffffff;
  background-color: #5978ba;
}

.btn-community[title="facebook"]:hover {
  background-color: #425f9e;
}

.btn-community[title="facebook"]:focus {
  outline: 0;
  -webkit-box-shadow: 0 0 0 0.2rem rgba(89, 120, 186, 0.5);
          box-shadow: 0 0 0 0.2rem rgba(89, 120, 186, 0.5);
}

#header {
  top: 0;
  left: 0;
  width: 100%;
  z-index: 160;
  position: fixed;
  background-color: #ffffff;
}

@media (max-width: 991px) {
  #header .small-wrap {
    padding: 0;
  }
  #header .mobile-cart-num {
    top: -10px;
    right: -10px;
    padding: .25rem;
    color: #ffffff;
    position: absolute;
    border-radius: 20px;
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
    background-color: red;
    font-size: 12px !important;
  }
}

#header .header-top {
  padding: .5rem 0;
  border-bottom: 1px solid #f3ad2b;
}

@media (max-width: 991px) {
  #header .header-top {
    padding: 1rem;
  }
}

#header .header-top .htop-body > .grid-wrap {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

@media (max-width: 991px) {
  #header .header-top .htop-body > .grid-wrap {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
}

#header .header-top .htop-body .bar-btn {
  padding: 1rem 0;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
}

#header .header-top .htop-body .bar-btn .bar {
  width: 25px;
  height: 2px;
  position: relative;
  background-color: #f3ad2b;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#header .header-top .htop-body .bar-btn .bar::before, #header .header-top .htop-body .bar-btn .bar::after {
  content: "";
  left: 0;
  width: 25px;
  height: 2px;
  position: absolute;
  background-color: #f3ad2b;
}

#header .header-top .htop-body .bar-btn .bar::before {
  bottom: 8px;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#header .header-top .htop-body .bar-btn .bar.animate {
  background-color: transparent;
}

#header .header-top .htop-body .bar-btn .bar.animate::before {
  -webkit-transform: translateY(8px) rotate(-45deg);
          transform: translateY(8px) rotate(-45deg);
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#header .header-top .htop-body .bar-btn .bar::after {
  top: 8px;
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#header .header-top .htop-body .bar-btn .bar.animate::after {
  -webkit-transform: translateY(-8px) rotate(45deg);
          transform: translateY(-8px) rotate(45deg);
  -webkit-transition: all .3s ease-in-out;
  transition: all .3s ease-in-out;
}

#header .header-top .mobile-logo {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 150px;
  height: 45px;
}

#header .header-top .mobile-logo img {
  max-width: 100%;
  max-height: 100%;
}

@media (min-width: 992px) {
  #header .header-top .mobile-logo {
    display: none !important;
  }
}

#header .header-top .header-icon > .grid-wrap > * > a {
  padding: 0 .5rem;
  text-align: center;
}

@media (min-width: 992px) {
  #header .header-top .header-icon > .grid-wrap > * > a {
    font-size: 90%;
  }
}

@media (max-width: 991px) {
  #header .header-top .header-icon {
    left: 0;
    bottom: 0;
    opacity: 1;
    width: 100%;
    position: fixed;
    padding: .75rem 0;
    background-color: #000000;
    -webkit-transition: all .35s ease-in-out;
    transition: all .35s ease-in-out;
  }
  #header .header-top .header-icon.header-icon-hide {
    opacity: 0;
    z-index: -1;
    bottom: -100px;
  }
  #header .header-top .header-icon .grid-wrap > * > a {
    color: #ffffff;
  }
  #header .header-top .header-icon .grid-wrap > * > a:hover {
    color: #e6e6e6;
  }
}

#header .header-top .header-icon .icon-switch svg.fa-sort-down {
  top: -2px;
  position: relative;
}

@media (min-width: 992px) {
  #header .header-top .header-icon a[title="語系選擇"] svg {
    margin-bottom: 2.8px;
  }
}

#header .header-menu .pc-logo {
  cursor: pointer;
  width: 100px;
  height: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-transition: max-width .3s ease-in-out;
  transition: max-width .3s ease-in-out;
}

#header .header-menu .pc-logo img {
  max-width: 100%;
  max-height: 100%;
}

@media (min-width: 992px) {
  #header .header-menu {
    height: auto !important;
    display: block !important;
  }
  #header .header-menu .hbottom-body > .grid-wrap {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

@media (max-width: 991px) {
  #header .header-menu {
    display: none;
    overflow-y: auto;
    max-height: calc(90vh - 83px);
    -webkit-box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
            box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
  }
  #header .header-menu .pc-logo {
    display: none !important;
  }
}

#header .header-menu .mobile-search {
  border-bottom: 1px solid #dee2e6;
}

#header .header-menu .mobile-search > div {
  padding: 1rem;
}

#header .header-menu .mobile-search svg {
  cursor: pointer;
}

#header .header-menu .menu-item:first-child {
  padding: .25rem 0;
}

@media (max-width: 991px) {
  #header .header-menu .menu-item:first-child {
    padding: 0;
  }
}

#header .header-menu .menu-item > a {
  padding: 1rem;
  color: #000000;
}

@media (min-width: 992px) {
  #header .header-menu .menu-item > a {
    -webkit-transition: color .4s ease-in-out;
    transition: color .4s ease-in-out;
  }
  #header .header-menu .menu-item > a:hover {
    color: #f3ad2b;
  }
}

@media (max-width: 991px) {
  #header .header-menu .menu-item > a {
    background-color: #f3ad2b;
    -webkit-transition: color .3s ease-in-out;
    transition: color .3s ease-in-out;
    -webkit-transform: perspective(1px) translateZ(0);
            transform: perspective(1px) translateZ(0);
  }
  #header .header-menu .menu-item > a::before {
    content: '';
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    position: absolute;
    -webkit-transform: scaleY(1);
            transform: scaleY(1);
    background-color: #ffffff;
    -webkit-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
  }
  #header .header-menu .menu-item:hover > a {
    color: #ffffff;
  }
  #header .header-menu .menu-item:hover > a::before {
    -webkit-transform: scaleY(0);
            transform: scaleY(0);
  }
}

#header .header-menu .menu-item .menu-sort {
  display: none;
  overflow: hidden;
}

#header .header-menu .menu-item .menu-sort .menu-sort-list > a {
  line-height: 1.2;
  color: #000000;
  padding: .5rem 1rem;
  background-color: #fafafa;
}

@media (max-width: 991px) {
  #header .header-menu .menu-item .menu-sort .menu-sort-list > a {
    border-bottom: 1px solid #dee2e6;
  }
  #header .header-menu .menu-item .menu-sort .menu-sort-list:first-child > a {
    border-top: 1px solid #dee2e6;
  }
}

#header .header-menu .menu-item .menu-sort .menu-sort-list:hover > a {
  color: #ffffff;
  background-color: #f3ad2b;
}

@media (min-width: 992px) {
  #header .header-menu .menu-item .menu-sort {
    width: 120%;
    margin: 0 -10%;
    position: absolute;
    top: calc(100% + .25rem);
  }
  #header .header-menu .menu-item .menu-sort > ul {
    max-height: 75vh;
    overflow-y: auto;
  }
  #header .header-menu .menu-item .menu-sort .menu-sort-list > a {
    padding: .5rem;
    color: #000000;
    text-align: center;
  }
  #header .header-menu .menu-item .menu-sort .menu-sort-list:not(:last-child) a {
    margin-bottom: .25rem;
  }
}

#header .pc-search {
  font-size: 90%;
  padding: .15rem;
  border-radius: 5px;
  border: 1px solid #dee2e6;
}

#header .lang-wrap {
  right: 0;
  top: 100%;
  width: 100%;
  display: none;
  max-width: 250px;
  position: absolute;
  background-color: #fafafa;
  -webkit-box-shadow: 3px 5px 5px 0.5px rgba(0, 0, 0, 0.3);
          box-shadow: 3px 5px 5px 0.5px rgba(0, 0, 0, 0.3);
}

#header .lang-wrap > ul {
  padding: 0.5rem 1rem;
}

#header .lang-wrap > ul li a {
  padding: .35rem;
  color: #000000;
}

#header .lang-wrap > ul li a:hover, #header .lang-wrap > ul li a.lang-active {
  color: #ffffff;
  background-color: #f3ad2b;
}

#footer {
  color: #ffffff;
  padding: 3rem 0;
}

@media (max-width: 991px) {
  #footer {
    margin-bottom: 40px;
    -webkit-transition: margin .35s ease-in-out;
    transition: margin .35s ease-in-out;
  }
  #footer.footer-mb-0 {
    margin-bottom: 0;
  }
}

@media (max-width: 767px) {
  #footer {
    padding: 2rem 0;
  }
}

@media (min-width: 768px) {
  #footer .footer-wrap {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
  }
  #footer .footer-wrap .footer-link {
    padding: 0 .75rem;
  }
}

@media (max-width: 767px) {
  #footer .footer-wrap {
    text-align: center;
  }
  #footer .footer-wrap > *:not(:last-child) {
    margin-bottom: 1rem;
  }
  #footer .footer-wrap .footer-icon {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

#footer .footer-wrap .footer-link > * {
  font-size: 90%;
  padding: 0 2rem .5rem 0;
}

@media (max-width: 767px) {
  #footer .footer-wrap .footer-link > * {
    padding: .5rem;
  }
  #footer .footer-wrap .footer-link > * > a {
    border: 1px solid #ffffff;
  }
}

#footer .footer-wrap .footer-link > * > a {
  padding: .5rem;
  color: #ffffff;
  border-bottom: 1px solid #ffffff;
}

#footer .footer-wrap .footer-link > *:hover a {
  color: #000000;
  background-color: #ffffff;
}

#footer .footer-wrap .footer-data {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

#footer .footer-wrap .footer-data > * {
  margin: .25rem 0;
}

@media (max-width: 767px) {
  #footer .footer-wrap .footer-data > *:not(:last-child) {
    margin-bottom: .51rem;
  }
}

@media (min-width: 768px) {
  #footer .footer-wrap .footer-data > * {
    padding: 0 .75rem;
    position: relative;
  }
  #footer .footer-wrap .footer-data > *:not(:last-child):not(:first-child)::before {
    content: '';
    top: 50%;
    right: 0;
    width: 1px;
    height: 20px;
    position: absolute;
    -webkit-transform: translateY(-50%);
            transform: translateY(-50%);
    border-right: 1px solid #ffffff;
  }
}

@media (min-width: 768px) {
  #footer .footer-wrap .qr-code {
    padding-right: 2.75rem;
  }
}

#footer .footer-wrap .qr-code img {
  max-width: 135px;
  width: 100%;
  height: auto;
}

#footer .footer-wrap .footer-share {
  max-width: 250px;
}

#footer .footer-wrap .footer-share > *:not(:first-child) {
  margin-left: .25rem;
}

#footer .footer-wrap .footer-share > *:not(:last-child) {
  margin-bottom: 1rem;
}

@media (max-width: 767px) {
  #footer .footer-wrap .footer-share {
    max-width: 100%;
  }
  #footer .footer-wrap .footer-share > .grid-wrap {
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
}

#footer .footer-wrap .footer-share svg {
  margin: .25rem;
  color: #ffffff;
  width: 2em !important;
  height: 2em !important;
}

#footer .footer-wrap .footer-share svg:hover {
  color: #f2f2f2;
}

body {
  background-image: url("../images/bg/body-bg.png");
  background-position: center;
  background-repeat: repeat;
}

.header-icon > .grid-wrap > * > a {
  color: #595959;
}

.header-icon > .grid-wrap > * > a:hover {
  color: #1a1a1a;
}

#footer {
  background-color: #de950d;
}

.slide-box::before {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  width: 100%;
  top: 0;
  bottom: 15px;
  background-image: url("../images/bg/slide-bg.jpg");
  background-position: bottom;
  background-repeat: no-repeat;
  background-size: cover;
}

.home-list.home-news {
  padding-bottom: 95px;
}

.home-list.home-news::after {
  content: '';
  background-image: url(../images/home/news-icon.png);
  width: 120px;
  height: 92.86px;
  display: block;
  position: absolute;
  right: 1rem;
  bottom: 0;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.home-list.home-news .main-title h4 {
  margin-top: 5rem;
}

.home-list.home-news .main-title h4::before {
  content: '';
  background-image: url(../images/home/news-title.png);
  width: 300px;
  height: 102.4px;
  display: block;
  position: absolute;
  left: 50%;
  -webkit-transform: translate(calc(-50% + 30px), -60px);
          transform: translate(calc(-50% + 30px), -60px);
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 575px) {
  .home-list.home-news .main-title h4::before {
    width: 250px;
    height: 85.34px;
  }
}

.home-list .home-service .minor-title {
  color: #f3ad2b;
  padding-bottom: 3rem;
}

.home-list .home-service .feature {
  color: #000000;
}

.home-description {
  background-color: #f3ad2b;
}

@media (min-width: 768px) {
  .home-description {
    overflow: visible;
  }
}

.home-description::after {
  content: ' ';
  display: block;
  position: absolute;
  background-image: url("../images/home/description-icon.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 200px;
  height: 144px;
  z-index: 1;
  left: 50%;
  -webkit-transform: translate(-20%, -35%);
          transform: translate(-20%, -35%);
}

@media (max-width: 991px) {
  .home-description::after {
    display: none;
  }
}

.home-description .description-list .description-detail::before {
  background-color: transparent !important;
  background-image: url("../images/home/description-title.png");
  -webkit-transform: rotate(0deg);
          transform: rotate(0deg);
  width: 445px;
  height: 264px;
  top: -10rem;
  left: -4rem;
}

@media (min-width: 768px) {
  .home-description .description-list .description-detail::before {
    background-color: #ffffff;
  }
  .home-description .description-list .description-detail h4 {
    color: #595959;
  }
  .home-description .description-list .description-detail .description-title::after {
    border-bottom: 1px #595959 solid;
  }
}

.home-description a {
  color: #ffffff;
}

.home-hot {
  padding-top: 8rem;
}

.home-hot .main-title h4 {
  position: relative;
}

.home-hot .main-title h4::before {
  content: '';
  background-image: url(../images/home/hot-title.png);
  width: 300px;
  height: 102.4px;
  display: block;
  position: absolute;
  left: 50%;
  -webkit-transform: translate(calc(-50% + 50px), -30px);
          transform: translate(calc(-50% + 50px), -30px);
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 575px) {
  .home-hot .main-title h4::before {
    width: 250px;
    height: 85.34px;
  }
}

.home-hot .main-title h4::after {
  content: '';
  background-image: url(../images/home/hot-icon.png);
  width: 120px;
  height: 74.48px;
  display: block;
  position: absolute;
  top: 5rem;
  left: 1rem;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 767px) {
  .home-hot .main-title h4::after {
    display: none;
  }
}

.home-hot::before {
  border-color: #f3ad2b transparent transparent transparent;
}

.item-list .item-link .hot-item {
  background-color: #77da7b;
}

@media (min-width: 992px) {
  .news-owl .item .item-link .circle-photo {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 250px;
            flex: 0 0 250px;
    max-width: 250px;
    padding-bottom: 0;
  }
  .news-owl .item .item-link .circle-photo > .circle-bg {
    width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 30px;
    overflow: hidden;
    border: 5px #ffffff solid;
    -webkit-transition: border-radius .3s ease-in-out;
    transition: border-radius .3s ease-in-out;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
  .news-owl .item .item-link:hover .circle-bg {
    border-radius: 50%;
  }
}

@media (max-width: 991px) {
  .news-owl .item .item-link .circle-photo > .circle-bg {
    margin: 0 auto;
    border-radius: 10px;
    overflow: hidden;
    border: 5px #ffffff solid;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
  }
}

.home-service::before {
  content: '';
  background-image: url(../images/home/service-icon-1.png);
  width: 150px;
  height: 123.46px;
  display: block;
  position: absolute;
  left: 1rem;
  top: 0;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 767px) {
  .home-service::before {
    display: none;
  }
}

.home-service::after {
  content: '';
  background-image: url(../images/home/service-icon-2.png);
  width: 200px;
  height: 72.68px;
  display: block;
  position: absolute;
  bottom: 0;
  right: 1rem;
  z-index: -1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 767px) {
  .home-service::after {
    display: none;
  }
}

.reserve-form {
  margin: 0 auto;
  padding: 0 1rem;
  background-color: #ffffff;
}

.reserve-form .reserve-header {
  position: relative;
  background-position: center !important;
  background-size: cover !important;
  overflow: hidden;
  -webkit-box-shadow: inset -3px 0px 6px -5px #1a1a1a;
          box-shadow: inset -3px 0px 6px -5px #1a1a1a;
}

@media (max-width: 991px) {
  .reserve-form .reserve-header {
    height: 250px;
    -webkit-box-shadow: inset 0px -3px 6px -5px #1a1a1a;
            box-shadow: inset 0px -3px 6px -5px #1a1a1a;
  }
}

.reserve-form .reserve-header::after {
  content: ' ';
  display: block;
  background-color: #ffffff;
  width: 50px;
  height: 50px;
  position: absolute;
  right: 0;
  top: 50%;
  -webkit-transform: rotate(45deg) translate(70%, 0%);
          transform: rotate(45deg) translate(70%, 0%);
  -webkit-box-shadow: -1px 1px 6px -1px gray;
          box-shadow: -1px 1px 6px -1px gray;
}

@media (max-width: 991px) {
  .reserve-form .reserve-header::after {
    left: 50%;
    right: unset;
    top: unset;
    bottom: 0;
    -webkit-transform: rotate(45deg) translate(0%, 70%);
            transform: rotate(45deg) translate(0%, 70%);
  }
}

.signup-wrap {
  text-align: left;
  width: 100%;
  height: 100%;
}

.signup-wrap h5 {
  display: inline;
}

.signup-wrap .add-btn, .signup-wrap .back-btn {
  display: inline;
  cursor: pointer;
  font-size: 1.2rem;
  position: relative;
  top: -.2rem;
  color: #f3ad2b;
}

.signup-wrap .add-btn:hover, .signup-wrap .back-btn:hover {
  color: gray !important;
}

.signup-wrap > div:not(:first-child) {
  border-bottom: 1px gray solid;
}

.signup-wrap .tr div, .signup-wrap .days div {
  color: #000000;
  background: #ffffff;
}

.signup-wrap .days {
  text-align: left;
  font-size: 1.1rem;
  line-height: 50px;
  vertical-align: bottom;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
}

.signup-wrap .days > .th {
  padding: 0 .5rem;
  color: #595959;
  font-weight: bold;
}

.signup-wrap .tr {
  font-size: 1.5rem;
  line-height: 50px;
  vertical-align: bottom;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
}

.signup-wrap .calendar-content {
  padding: 5px;
  color: #5d96e0;
}

.signup-wrap .th {
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
  max-width: 100%;
}

.signup-wrap .td {
  padding: 0 1rem;
  position: relative;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  -ms-flex-preferred-size: 0;
      flex-basis: 0;
  max-width: 100%;
}

.signup-wrap .td:nth-child(7n+1) {
  color: red !important;
}

.signup-wrap .td:nth-child(7n+7) {
  color: #ff8000 !important;
}

.signup-wrap .td:not(:empty) {
  min-height: 100px;
}

@media (max-width: 575px) {
  .signup-wrap .td:not(:empty) {
    min-height: auto;
    text-align: center;
  }
}

.signup-wrap .td.reservation:hover {
  opacity: .5;
  cursor: pointer;
}

@media (max-width: 767px) {
  .signup-wrap .td.reservation {
    background-color: rgba(136, 201, 59, 0.5);
  }
}

.signup-wrap .td span {
  display: block;
  font-size: .95rem;
  background-color: #88c93b;
  color: #ffffff;
  border-radius: 5px;
  margin-bottom: .2rem;
  text-align: center;
}

@media (max-width: 767px) {
  .signup-wrap .td span {
    display: none;
  }
}

@media (max-width: 575px) {
  .signup-wrap .td {
    padding: 0 .2rem;
  }
}

#signup-form {
  padding: 1rem 15px;
  background-color: #ffffff;
}

#signup-form .font-h5 {
  border-bottom: 1px #999999 solid;
}

@media (max-width: 991px) {
  #signup-form {
    -webkit-box-ordinal-group: 13;
        -ms-flex-order: 12;
            order: 12;
  }
}

#signup-form > .form-group {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

#signup-form > .form-group > label {
  text-align: right;
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 55px;
          flex: 0 0 55px;
  max-width: 55px;
}

@media (max-width: 575px) {
  #signup-form > .form-group > label {
    text-align: left;
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

#signup-form > .form-group > *:not(label) {
  width: 100%;
  -webkit-box-flex: 0;
      -ms-flex: 0 0 calc(100% - 60px);
          flex: 0 0 calc(100% - 60px);
  max-width: calc(100% - 60px);
}

@media (max-width: 575px) {
  #signup-form > .form-group > *:not(label) {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
            flex: 0 0 100%;
    max-width: 100%;
  }
}

.signup-data:not(:last-child) {
  margin-bottom: 3rem;
}

.signup-data .signup-list > h4 {
  font-size: 1.2rem;
}

.signup-data .signup-list:not(:last-child) {
  margin-bottom: 0.5rem;
}

.signup-data .signup-item:not(:last-child) {
  margin-bottom: 1.5rem;
}

.signup-modal .signup-item:not(:last-child) {
  padding-bottom: 1rem;
  border-bottom: 1px #999999 solid;
}

.signup-outer {
  position: relative;
}

.signup-outer::before {
  content: '';
  background-image: url(../images/home/service-icon-1.png);
  width: 150px;
  height: 123.46px;
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  -webkit-transform: translate(0, 50%);
          transform: translate(0, 50%);
  z-index: 1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

@media (max-width: 991px) {
  .signup-outer::before {
    display: none;
  }
}

.signup-outer::after {
  content: ' ';
  display: block;
  position: absolute;
  background-image: url("../images/home/description-icon.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 138.89px;
  height: 100px;
  z-index: 1;
  right: 0;
  bottom: 0;
  -webkit-transform: translate(0, 50%);
          transform: translate(0, 50%);
}

@media (max-width: 991px) {
  .signup-outer::after {
    display: none;
  }
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 {
  padding: 15px;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list {
  text-align: center;
  background: #f2f2f2;
  padding: 3rem 1rem;
  border-radius: 10px;
  height: 100%;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list > div {
  word-wrap: break-word;
  word-break: break-all;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list > div:nth-child(2) {
  padding-bottom: .5rem;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list .icon {
  font-size: 2.5rem;
  -webkit-transition: all .3s;
  transition: all .3s;
  margin-bottom: 1rem;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list .icon:hover {
  opacity: .8;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list .icon > a {
  display: inline-block;
  width: 30%;
  padding-bottom: 30%;
  position: relative;
  background: #f3ad2b;
  border-radius: 100%;
}

.download-wrap .grid-lg-3.grid-sm-6.grid-12 .download-list .icon svg {
  color: #ffffff;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
/*# sourceMappingURL=web-style.css.map */