/*-- GT offline css --*/

      :root {
         --thumbnail-width: 240px;
         --bg-gt-purple: #4F2D7F;
         }
         * {
         font-family: 'Noto Sans TC', sans-serif;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
         }
         *:before, *:after {
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
         }
         div {
         display: block;
         }
         .text-gt {
         color: var(--bg-gt-purple);
         }
         .navbar-gt {
           background-color: #ffffff;
           -webkit-transition: opacity 2s ease-in-out;
           -moz-transition: opacity 1s ease-in-out;
           -ms-transition: opacity 1s ease-in-out;
           -o-transition: opacity 1s ease-in-out;
           opacity: 1;
         }
         nav.navbar-gt.hiddenav {
           opacity: 0;
         }
         .navbar-gt .navbar-brand {
           float: left;
         }
         .navbar-gt .navbar-brand img {
           width: 38px;
           height: 38px;
         }
         .navbar-gt .navbar-nav > .nav-link {
           padding: 10px;
           line-height: 40px;
           min-height: 64px;
         }
         .navbar-gt .navbar-nav > .nav-link:hover {
           color: #4F2D7F;
         }
         .nav-link {
           color: #4F2D7F;
           font-size: 1.1rem;
           text-decoration: none;
           display: block;
           padding: 10.656px 10px 14px;
           position: relative;
           word-break: break-word;
           transition: all .3s 0s
           border-bottom: 2px solid transparent;
           cursor: pointer;
         }
         .navbar-gt .navbar-nav > .nav-link:hover, .navbar-gt .navbar-nav > .nav-link:active, .navbar-gt .navbar-nav > .nav-link:focus {
           color:#de002e;
           text-decoration:underline
         }
         .navbar-gt .navbar-toggler {
           border-color: #fff; 
         }
         .navbar-gt .navbar-toggler:focus {
           background: none; outline: 0;
         }
         .navbar-gt .navbar-toggler span {
	   display: block; 
           width: 30px; 
           height: 2px; 
           margin: 6px auto; 
           background: #4F2D7F;
	   transition: all .6s cubic-bezier(0.250, 0.100, 0.250, 1.000);
         }
         .navbar-gt .navbar-toggler:hover span { 
           background: #ccc;
         }
       /* rotate first span */
         .navbar-gt .navbar-toggler[aria-expanded="true"] span:first-of-type { 
           transform: rotate(45deg) translate(6px, 6px); 
         }
       /* hide second span */
         .navbar-gt .navbar-toggler[aria-expanded="true"] span:nth-of-type(2) { 
           opacity: 0; 
         }
       /* rotate third span */
         .navbar-gt .navbar-toggler[aria-expanded="true"] span:last-of-type { 
           transform: rotate(-45deg) translate(5px, -5px);
         }
         .navbar-gt .navbar-toggler[aria-expanded="false"] span { 
           transform: none; opacity: 1; 
         }
         .masthead {
         background-repeat: no-repeat;
         background-position: center center;
         background-size: cover;
         padding-top: 10.5rem;
         padding-bottom: 6rem;
         color: #fff;
         }
         .masthead.listed {
         background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(72, 15, 144, 0.4)), url("../images/img/banner-bg_02.jpg");
         }
         .masthead.login {
         background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(72, 15, 144, 0.4)), url("../images/img/banner-bg.jpg");
         }
         article,
         aside,
         details,
         figcaption,
         figure,
         footer,
         header,
         hgroup,
         main,
         nav,
         section,
         summary {
         display: block
         }
         footer {
         background: #4F2D7F;
         padding: 128px 0 96px 0;
         color: #fff
         }
         footer .social-media-float {
         padding-left: 0;
         padding-right: 0
         }
         footer .social-media-float .social-media {
         font-size: 1.8rem;
         color: #fff;
         width: 100%;
         margin: 0
         }
         footer .social-media-float .social-media .social-media-list {
         display: table;
         width: 100%
         }
         footer .social-media-float .social-media .social-media-list li {
         display: table-cell
         }
         footer .social-media-float .social-media .social-media-list li a {
         display: inline-block;
         color: #fff;
         text-decoration: none;
         cursor: pointer
         }
         footer .social-media-float .social-media .social-media-list li a svg {
         display: block;
         height: 3rem;
         fill: currentColor !important
         }
         footer .social-media-float .social-media .social-media-list li a svg path,
         footer .social-media-float .social-media .social-media-list li a svg rect {
         fill: currentColor !important
         }
         footer .social-media-float .social-media .social-media-list img,
         footer .social-media-float .social-media .social-media-list svg {
         width: auto;
         max-width: 100%
         }
         footer .link-list {
         padding-left: 0;
         padding-right: 0
         }
         footer .copyright {
         padding-top: 64px;
         color: #fff
         }
         footer ul {
         padding: 0;
         margin: 0
         }
         footer li {
         list-style: none;
         margin: 0 0 16px 0
         }
         footer li span {
         font-size: 1.0rem;
         color: #fff;
         text-decoration: none;
         text-transform: uppercase;
         font-weight: 700
         }
         footer li a {
         font-size: 1.0rem;
         color: #fff;
         text-decoration: none;
         cursor: pointer
         }
         footer li a:hover,
         footer li a:active,
         footer li a:focus {
         color: #de002e
         }
         @media (min-width: 1200px) {
           footer .social-media-float .social-media .social-media-list li {
             padding-left: 16px;
             padding-right: 16px
           }
           footer.campaign-footer .copyright {
             padding-top: 0
           }
         }
         @media (min-width: 992px) and (max-width: 1199.98px) {
           footer .social-media-float {
             padding-bottom: 64px
           }
           footer .social-media-float .social-media .social-media-list li a {
             min-width: 64px
           }
         }
         @media (min-width: 768px) and (max-width: 991.98px) {
           footer .social-media-float {
             float: right;
           }
           footer li a {
             transition: all .3s 0s cubic-bezier(0.4, 0, 0.2, 1)
           }
           footer .foot_f {
             order: 1;
             margin-bottom: 50px
           }
           footer .foot_m {
             order: 2
           }
           footer .foot_l {
             order: 3
           }
         }
         @media (min-width: 576px) and (max-width: 767.98px) {
           footer {
             padding: 64px 0
           }
           footer .social-media-float {
             padding: 0 16px 32px 16px
           }
           footer .social-media-float .social-media {
             text-align: left
           }
           footer .social-media-float .social-media .social-media-list {
             text-align: left
           }
           footer .copyright {
             padding-top: 32px
           }
           footer ul {
             padding-bottom: 32px
           }
         }