﻿@import url("https://fonts.googleapis.com/css?family=Hind:400,700");@import url("https://fonts.googleapis.com/css2?family=Neuton:wght@200&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@300&display=swap");@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+TC&display=swap");@import url("https://fonts.googleapis.com/css2?family=Cormorant+Upright:wght@300400&display=swap");@import url("https://fonts.googleapis.com/css2?family=Carrois+Gothic&display=swap");body{font-family:"Noto Sans TC","Noto Serif TC","STHeiti Light","Heiti TC","微軟正黑體","Microsoft JhengHei",sans-serif;color:#ddd;font-size:.95em;line-height:1.5;letter-spacing:1px;background:#000;-webkit-text-size-adjust:100%;-moz-transition:background .6s;-o-transition:background .6s;-webkit-transition:background .6s;transition:background .6s}a,i{text-decoration:none;color:#aaa}a:hover,i:hover{color:#aaa}.cn{font-family:"Noto Sans TC","Noto Serif TC","STHeiti Light","Heiti TC","微軟正黑體","Microsoft JhengHei",sans-serif}.en{font-size:.95em;font-family:"Carrois Gothic","Hind",Arial,Helvetica}.title-en{font-family:"Cormorant Upright","Neuton",serif}.wrapper{overflow:hidden}.header{pointer-events:none;position:fixed;display:flex;-webkit-align-items:center;align-items:center;-webkit-justify-content:space-between;justify-content:space-between;width:100%;padding:50px 100px 0 100px;top:0;z-index:10;box-sizing:border-box}.logo{pointer-events:auto;position:relative;z-index:5}.ontop .logo .logo-img{opacity:1}.logo-img{width:60px;-webkit-filter:drop-shadow(1px 2px 1px #8c7b67);filter:drop-shadow(1px 2px 1px #8c7b67)}.menu{pointer-events:auto}.nav-show .menu{position:absolute}.burger{cursor:pointer;padding:5px;display:flex;-webkit-align-items:center;align-items:center;-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.burger:hover{-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.burger-name{position:relative;padding:10px 7px 6px 13px;color:#ddd;line-height:1;font-size:.75em;-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.ontop .burger-name{color:#ddd}.ontop .burger-name:before{border-top:solid 1px #ddd;border-bottom:solid 2px #ddd}.burger:hover .ontop .burger-name:before{border-bottom:solid 1px #ddd}.burger-name:before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;border-top:solid 1px #ddd;border-bottom:solid 2px #ddd;border-radius:50%;-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.burger-name span{display:block;width:20px}.burger:hover .burger-name{-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.burger:hover .burger-name:before{border-bottom:solid 1px #888;-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.burger-bar{width:3px;height:3px;margin:0 -1px;background:#888;border-radius:50%;box-shadow:0px 0px 1px #79531f;-moz-transition:margin .6s;-o-transition:margin .6s;-webkit-transition:margin .6s;transition:margin .6s}.ontop .burger-bar{background:#fff}.nav-show .burger-bar{margin-left:40px}.nav{position:fixed;top:0;left:0;width:100%;height:0%;overflow:hidden;-moz-transition:height 0s 1.2s;-o-transition:height 0s 1.2s;-webkit-transition:height 0s;-webkit-transition-delay:1.2s;transition:height 0s 1.2s}.nav-show .nav{height:100%;-moz-transition-delay:0s;-o-transition-delay:0s;-webkit-transition-delay:0s;transition-delay:0s}.nav-bg{position:absolute;top:0;width:100%;height:100%;background:#1d1d1d;opacity:0;-moz-transition:opacity .6s .6s;-o-transition:opacity .6s .6s;-webkit-transition:opacity .6s;-webkit-transition-delay:.6s;transition:opacity .6s .6s}.nav-show .nav-bg{opacity:1;-moz-transition-delay:0s;-o-transition-delay:0s;-webkit-transition-delay:0s;transition-delay:0s}.nav-close{position:absolute;cursor:pointer;width:30px;height:30px;top:70px;right:70px;margin:10px;padding:10px;-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.nav-close-bar{width:0;height:1px;background:#fff;margin:15px;-moz-transition:width .6s,margin .6s;-o-transition:width .6s,margin .6s;-webkit-transition:width .6s,margin .6s;transition:width .6s,margin .6s}.nav-close-bar:nth-child(1){-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg)}.nav-close-bar:nth-child(2){-moz-transform:translateY(-15px) rotate(-45deg);-ms-transform:translateY(-15px) rotate(-45deg);-webkit-transform:translateY(-15px) rotate(-45deg);transform:translateY(-15px) rotate(-45deg)}.nav-show .nav-close-bar{width:30px;margin:15px 0;-moz-transition-delay:.6s;-o-transition-delay:.6s;-webkit-transition-delay:.6s;transition-delay:.6s}.nav-wrap{position:absolute;max-width:260px;top:55%;left:50%;padding:80px 0;user-select:none;--marquee-width:100vw;--offset:20vw;--move-initial:calc(-25% + var(--offset));--move-final:calc(-50% + var(--offset));--item-font-size:2.5em;overflow:hidden;-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.nav-wrap:before{content:"";position:absolute;top:0;right:0;width:0%;height:100%;background:#000;-moz-transition:width .6s;-o-transition:width .6s;-webkit-transition:width .6s;transition:width .6s}.nav-show .nav-wrap:before{width:100%;-moz-transition-delay:.6s;-o-transition-delay:.6s;-webkit-transition-delay:.6s;transition-delay:.6s}.nav-wrap li{position:relative;padding:2px 80px;display:flex;-webkit-flex-flow:column;flex-flow:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;cursor:default;opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:all .6s;-o-transition:all .6s;-webkit-transition:all .6s;transition:all .6s}.nav-show .nav-wrap li{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.nav-wrap li:hover{background:#111;-moz-transition:background .3s;-o-transition:background .3s;-webkit-transition:background .3s;transition:background .3s;-moz-transition-delay:0s;-o-transition-delay:0s;-webkit-transition-delay:0s;transition-delay:0s}.nav-link{position:relative;color:#fff;padding:5px 10px;margin:5px;line-height:1;white-space:nowrap;font-size:calc(var(--item-font-size) / 2.5);-moz-transition:all .3s;-o-transition:all .3s;-webkit-transition:all .3s;transition:all .3s}.nav-link:hover{color:#fff;letter-spacing:.2em}.nav-link:hover ~ .nav-marquee .nav-marquee-inner{animation-play-state:running;opacity:1;transition-duration:.4s}.nav-link .en{opacity:1;display:inline-block}.nav-link .tw{position:absolute;left:calc(50% - 32.14px);white-space:nowrap;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s;color:#fff}.nav-link .tw.w5{left:calc(50% - 40.5px)}.nav-link:hover .en{opacity:0}.nav-link:hover .tw{opacity:1}.nav-marquee{display:none;position:absolute;top:0;left:-100px;width:var(--marquee-width);overflow:hidden;pointer-events:none;mix-blend-mode:color-burn}.nav-marquee span{font-style:italic;text-align:center;white-space:nowrap;font-size:var(--item-font-size)}.nav-marquee-inner{position:relative;width:fit-content;display:flex;line-height:1;letter-spacing:.3em;transform:translate3d(var(--move-initial), 0, 0);animation:marquee 5s linear infinite;animation-play-state:paused;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}@-moz-keyframes marquee{0%{transform:translate3d(var(--move-initial), 0, 0)}100%{transform:translate3d(var(--move-final), 0, 0)}}@-webkit-keyframes marquee{0%{transform:translate3d(var(--move-initial), 0, 0)}100%{transform:translate3d(var(--move-final), 0, 0)}}@keyframes marquee{0%{transform:translate3d(var(--move-initial), 0, 0)}100%{transform:translate3d(var(--move-final), 0, 0)}}.main{position:relative;padding:200px 0 0;z-index:5}.top{position:relative}.top-images{position:relative;height:100vh;background-size:cover;background-position:center;overflow:hidden}.footer{position:relative;display:flex;-webkit-flex-flow:column;flex-flow:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;padding:30px;font-size:.75em;background:#1d1d1d}.footer-logo{display:inline-block;width:45px;margin:0 0 10px}.footer-logo img{width:100%}.footer-nav{margin:10px auto 20px}.footer-nav a{display:inline-block}.footer-nav a:nth-child(2){margin:0 5px;padding:0 10px;border-left:solid 1px #aaa;border-right:solid 1px #aaa}.footer-info{text-align:center}.scroll-down{cursor:pointer;position:absolute;width:20px;height:30px;left:50%;bottom:10%;border-radius:12px;border:solid 1px #fff;z-index:5;-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%)}.scroll-down span{position:absolute;display:block;width:5px;height:5px;left:50%;border-radius:10px;background:#fff;-moz-transform:translate(-50%, -50%);-ms-transform:translate(-50%, -50%);-webkit-transform:translate(-50%, -50%);transform:translate(-50%, -50%);-moz-animation:scrolldown 1.8s linear infinite;-webkit-animation:scrolldown 1.8s linear infinite;animation:scrolldown 1.8s linear infinite}.scroll-top{cursor:pointer;position:fixed;bottom:-40px;right:20px;width:36px;height:40px;color:#000;line-height:30px;font-size:.75em;text-align:center;border-radius:10px;background:#fff;z-index:9;opacity:0;-moz-transition:opacity .4s,bottom .8s;-o-transition:opacity .4s,bottom .8s;-webkit-transition:opacity .4s,bottom .8s;transition:opacity .4s,bottom .8s}.scroll-top.show-scroll{bottom:-10px;opacity:1}@-moz-keyframes scrolldown{0%{top:3px;opacity:0}20%{top:5px;opacity:1}60%{top:10px;opacity:1}95%{top:12px;opacity:0}100%{top:5px;opacity:0}}@-webkit-keyframes scrolldown{0%{top:3px;opacity:0}20%{top:5px;opacity:1}60%{top:10px;opacity:1}95%{top:12px;opacity:0}100%{top:5px;opacity:0}}@keyframes scrolldown{0%{top:3px;opacity:0}20%{top:5px;opacity:1}60%{top:10px;opacity:1}95%{top:12px;opacity:0}100%{top:5px;opacity:0}}@media screen and (max-width: 720px){.header{padding:50px 50px 0 50px}}@media screen and (max-width: 640px){.header{padding:30px 30px 0 30px}.nav-close{top:50px;right:0}.nav-wrap{padding:50px 0}}
