/*! Pushy - v1.3.0 - 2019-6-25
* Pushy is a responsive off-canvas navigation menu using CSS transforms & transitions.
* https://github.com/christophery/pushy/
* by Christopher Yee */
/* Menu Appearance */
.pushy {
  position: fixed;
  width: 280px;
  height: 100%;
  top: 0;
  z-index: 9995;
  background: #191918;
  overflow: auto;
  padding-top: 60px;
  -webkit-overflow-scrolling: touch;
  /* enables momentum scrolling in iOS overflow elements */
}
.pushy li a {
  display: block;
  color: #fff;
  padding: 15px 30px;
  text-decoration: none;
}
.pushy li a:hover {
  color: #FFF;
}
.pushy > ul {
    margin: 0;
    padding: 0;
}
.pushy ul:first-child {
  margin-top: 10px;
}
.pushy.pushy-left {
  left: 0;
}
.pushy.pushy-right {
  right: 0;
}

.pushy-content {
  visibility: hidden;
}

/* Menu Movement */
.pushy-left {
  -webkit-transform: translate3d(-280px, 0, 0);
  -ms-transform: translate3d(-280px, 0, 0);
  transform: translate3d(-280px, 0, 0);
}

.pushy-open-left #container,
.pushy-open-left .push {
  -webkit-transform: translate3d(280px, 0, 0);
  -ms-transform: translate3d(280px, 0, 0);
  transform: translate3d(280px, 0, 0);
}

.pushy-right {
  -webkit-transform: translate3d(280px, 0, 0);
  -ms-transform: translate3d(280px, 0, 0);
  transform: translate3d(280px, 0, 0);
}

.pushy-open-right #container,
.pushy-open-right .push {
  -webkit-transform: translate3d(-280px, 0, 0);
  -ms-transform: translate3d(-280px, 0, 0);
  transform: translate3d(-280px, 0, 0);
}

.pushy-open-left .pushy,
.pushy-open-right .pushy {
  -webkit-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
}
.pushy-open-left .pushy-content,
.pushy-open-right .pushy-content {
  visibility: visible;
}

/* Menu Transitions */
#container,
.pushy,
.push {
  transition: transform 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
}

.pushy-content {
  transition: visibility 0.2s cubic-bezier(0.16, 0.68, 0.43, 0.99);
}

/* Site Overlay */
.site-overlay {
  display: none;
}

.pushy-open-left .site-overlay,
.pushy-open-right .site-overlay {
  display: block;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 9994;
  background-color: rgba(0, 0, 0, 0.5);
  -webkit-animation: fade 500ms;
  animation: fade 500ms;
}

@keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* Submenu Appearance */
.pushy-submenu {
  /* Submenu Buttons */
  /* Submenu Icon */
}
.pushy-submenu > ul {
  padding-left: 15px;
  transition: max-height 0.2s ease-in-out, visibility 0.2s ease-in-out;
}
.pushy-submenu > ul .pushy-link {
  transition: opacity 0.2s ease-in-out;
}
.pushy-submenu button {
  width: 100%;
  color: #fff;
  padding: 15px 30px;
  text-align: left;
  background: transparent;
  border: 0;
}
.pushy-submenu button:hover {
  color: #fff;
}
.pushy-submenu > a,
.pushy-submenu > button {
  position: relative;
  font-size: 1rem;
}
.pushy-submenu > a::after,
.pushy-submenu > button::after {
  content: '';
  display: block;
  height: 11px;
  width: 8px;
  position: absolute;
  top: 50%;
  right: 15px;
  background: url("../images/arrow.svg") no-repeat;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  transition: transform 0.2s;
}

/* Submenu Movement */
.pushy-submenu-closed > ul {
  max-height: 0;
  overflow: hidden;
  visibility: hidden;
}
.pushy-submenu-closed .pushy-link {
  opacity: 0;
}

.pushy-submenu-open {
  /* Submenu Icon */
}
.pushy-submenu-open > ul {
  max-height: 1000px;
  visibility: visible;
}
.pushy-submenu-open .pushy-link {
  opacity: 1;
}
.pushy-submenu-open > a::after,
.pushy-submenu-open > button::after {
  -webkit-transform: translateY(-50%) rotate(90deg);
  -ms-transform: translateY(-50%) rotate(90deg);
  transform: translateY(-50%) rotate(90deg);
}
.pushy-submenu > ul .pushy-link {
  position: relative;
}
.pushy-submenu > ul .pushy-link::before {
  content: "";
  display: block;
  height: inherit;
  padding: 15px 0;
  width: 10px;
  
  position: absolute;
  left: -15px;
  top: 0;
  bottom: 0;
}

.pushy-submenu > ul  { overflow: visible;

}

.pushy-submenu > ul .pushy-link:hover::before {
  background-color: #2f9c99;
}

/* pure-drawer.css */

/**************
## Container ##
**************/
.pure-container {
  position: relative;
  height: 100%;
  -webkit-overflow-scrolling: touch;
}

/************
## Toggler ##
************/
.pure-toggle {/*left: -9999px; position: absolute; top: -9999px;*/ display: none; }
.pure-toggle:focus ~ .pure-toggle-label {border-color: #1fc08e; color: #1fc08e; }
.pure-toggle-label {cursor: pointer; display: block; position: fixed; top: -10px; z-index: 9997; color: #5d809d; width: 64px; height: 64px; -webkit-transition: all 400ms ease-in-out; transition: all 400ms ease-in-out; border: 2px solid #5d809d; border-radius: 50%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; -o-user-select: none; user-select: none; -webkit-tap-highlight-color: transparent; } 
.pure-toggle-label:hover {border-color: #1fc08e; color: #1fc08e; }
.pure-toggle-label:hover .pure-toggle-icon, .pure-toggle-label:hover .pure-toggle-icon:before, .pure-toggle-label:hover .pure-toggle-icon:after {background-color: #1fc08e; } 
.pure-toggle-label:active {-webkit-tap-highlight-color: transparent; }
.pure-toggle-label .pure-toggle-icon, .pure-toggle-label .pure-toggle-icon:before, .pure-toggle-label .pure-toggle-icon:after {position: absolute; top: 55%; left: 50%; height: 4px; width: 35px; cursor: pointer; background: #5d809d; display: block; content: ''; -webkit-transition: all 500ms ease-in-out; transition: all 500ms ease-in-out; }
.pure-toggle-label .pure-toggle-icon {transform: translate3d(-50%, -4px, 0); -webkit-transform: translate3d(-50%, -4px, 0); }
.pure-toggle-label .pure-toggle-icon:before {transform: translate3d(-50%, -14px, 0); -webkit-transform: translate3d(-50%, -14px, 0); }
.pure-toggle-label .pure-toggle-icon:after {transform: translate3d(-50%, 10px, 0); -webkit-transform: translate3d(-50%, 10px, 0); }
.pure-toggle-label[data-toggle-label='left'] {left: 15px; right: auto; }
.pure-toggle-label[data-toggle-label='right'] {right: 28px; left: auto; }
.pure-toggle-label[data-toggle-label='top'] {left: 50%; -webkit-transform: translate3d(-50%, 0, 0); transform: translate3d(-50%, 0, 0); }
.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label:not([data-toggle-label='left']), .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label:not([data-toggle-label='right']), .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label:not([data-toggle-label='top']) {opacity: 0; z-index: -1; } 
.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'], .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'], .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] {border-color: #1fc08e; color: #1fc08e; }
.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon, .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon, .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon {background-color: transparent; }
.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:before, .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:after, .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:before, .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:after, .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:before, .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:after {top: -5px; } 
.pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:before, .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:before, .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:before {transform: translateX(-50%) rotate(45deg); -webkit-transform: translateX(-50%) rotate(45deg); } .pure-toggle[data-toggle='left']:checked ~ .pure-toggle-label[data-toggle-label='left'] .pure-toggle-icon:after, .pure-toggle[data-toggle='right']:checked ~ .pure-toggle-label[data-toggle-label='right'] .pure-toggle-icon:after, .pure-toggle[data-toggle='top']:checked ~ .pure-toggle-label[data-toggle-label='top'] .pure-toggle-icon:after {transform: translateX(-50%) translateY(-10px) rotate(-45deg); -webkit-transform: translateX(-50%) translateY(-10px) rotate(-45deg); top: 15px; }


/* Custom navigation arrows */
/*.fotorama__arr--prev, .fotorama__arr--next {display: none !important;}*/

.nav-arrows span,
.fotorama__arr, .fotorama_custom__arr, .nbs-flexisel-nav-left,
.nbs-flexisel-nav-right {
    background-image: none;
    position: absolute;
    z-index: 97;
    top: 50%;
    width: 40px;
    height: 40px;
    border: 4px solid #fff;
    text-indent: -90000px;
    margin-top: -40px;
    cursor: pointer;
    -webkit-transform: rotate(45deg) !important;
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg) !important;
    opacity: 1 !important;
}

.nav-arrows span:hover,
.fotorama__arr:hover, .nbs-flexisel-nav-left:hover,
.nbs-flexisel-nav-right:hover {
    border-color: #30f;
}

.nav-arrows span.nav-arrow-prev, .fotorama__arr--prev,
.fotorama_custom__arr--prev, .nbs-flexisel-nav-left {
    border-right: none;
    border-top: none;
}

.nav-arrows span.nav-arrow-next, .fotorama__arr--next,
.fotorama_custom__arr--next, .nbs-flexisel-nav-right {
    border-left: none;
    border-bottom: none;
}

.nav-arrows span.nav-arrow-prev, .fotorama__arr--prev,
.fotorama_custom__arr--prev{
    left: 20px;
}

.nav-arrows span.nav-arrow-next, .fotorama__arr--next,
.fotorama_custom__arr--next {
    right: 20px;
}

.fotorama__arr--disabled {
  opacity: .2 !important;
}

@media all and (max-width: 480px) {
    .nav-arrows span.nav-arrow-prev, .fotorama__arr--prev,
    .fotorama_custom__arr--prev {
      left: -30px;
    }
    .nav-arrows span.nav-arrow-next, .fotorama__arr--next,
    .fotorama_custom__arr--next {
      right: -30px;
    }
    .fotorama__arr, .nbs-flexisel-nav-left,
    .nbs-flexisel-nav-right {
        bottom: 17.5%;
    }
}

.fotorama__caption {
  font-family: GTWalsheimGQ, "Helvetica Neue", Helvetica, Arial, 'Noto Sans CJK TC', 'sourcehansans-tc', 'Noto Sans TC', SansBodyCJK, sans-serif;
}

.fotorama__dot {width: 12px; height: 12px; border-radius: 50%; border: 2px solid #fff;}
.fotorama__nav__frame.fotorama__active .fotorama__dot {width: 12px; height: 12px; background-color: #f30; border-color: #f30;}

/* nprogress.css */
/* Make clicks pass-through */

#nprogress {pointer-events: none;}
#nprogress .bar {
    background: rgb(218, 244, 0);
    position: fixed;
    z-index: 2031;
    top: 0;
    left: 0;
    width: 100%;
    height: 2px;
}

/* Fancy blur effect */
#nprogress .peg {
    display: block;
    position: absolute;
    right: 0px;
    width: 100px;
    height: 100%;
    box-shadow: 0 0 10px #29d, 0 0 5px #29d;
    opacity: 1.0;
    -webkit-transform: rotate(3deg) translate(0px, -4px);
    -ms-transform: rotate(3deg) translate(0px, -4px);
    transform: rotate(3deg) translate(0px, -4px);
}

/* Remove these to get rid of the spinner */
#nprogress .spinner {
    display: block;
    position: fixed;
    z-index: 2031;
    top: 15px;
    right: 15px;
}
#nprogress .spinner-icon {
    width: 18px;
    height: 18px;
    box-sizing: border-box;
    border: solid 2px transparent;
    border-top-color: #fff;
    border-left-color: #fff;
    border-radius: 50%;
    -webkit-animation: nprogress-spinner 400ms linear infinite;
    animation: nprogress-spinner 400ms linear infinite;
}
.nprogress-custom-parent {
    overflow: hidden;
    position: relative;
}
.nprogress-custom-parent #nprogress .spinner,
.nprogress-custom-parent #nprogress .bar {
    position: absolute;
}

@-webkit-keyframes nprogress-spinner {
    0% {
        -webkit-transform: rotate(0deg);
    }
    100% {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes nprogress-spinner {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* magnific-popup menu addition */
.white-popup {
    position: relative;
    background: #fff;
    padding: 20px;
    width: 100%;
    max-width: calc(100% - 20px);
    margin: 10px auto;
    font-size: 0.875em;
    text-align: center;
}
.mfp-close:before,
.mfp-close:after {
    position: absolute;
    left: 15px;
    content: ' ';
    height: 33px;
    width: 2px;
    background-color: #0057ff;
    top: 15px;
}
.mfp-close:before {
    transform: rotate(45deg);
}
.mfp-close:after {
    transform: rotate(-45deg);
}
.mfp-close {
    text-indent: -9999px;
}


@media all and (min-width: 600px) {
    .white-popup {
        max-width: 480px;
        margin: 5vw auto;
    }
}
@media all and (min-width: 980px) {
    .white-popup {
      padding: 40px;
    }
}
@media all and (min-width: 1200px) {
    .white-popup {
      max-width: 480px;
    }
}
