﻿@import url("https://fonts.googleapis.com/css?family=Hind:400,700");@import url("https://fonts.googleapis.com/css2?family=Marcellus&display=swap");.browserUpdate{position:fixed;top:0;left:0;width:100%;height:100%;z-index:999;background:#333;background:rgba(0,0,0,0.8);font-size:15px;text-align:center}.updateInfo{position:absolute;left:50%;top:50%;width:560px;height:260px;padding:20px;background:#FFF;margin:-150px 0 0 -300px;border-radius:10px}.updateTxt{max-width:440px;margin:0 auto}.infoTxt1{color:#000;font-size:20px;font-weight:700}.updateTxt2{font-size:14px}.browserList li{display:inline-block;zoom:1;width:65px;margin:30px 15px}.browserList img{width:100%}.viewsite{text-decoration:underline;color:#666;cursor:pointer}.viewsite:hover{color:#09f}@media screen and (max-width: 760px){.browserUpdate{height:110%;text-align:left}.updateInfo{position:static;margin:20px;width:auto;height:auto}.updateTxt{max-width:none}.browserList li{width:45px}}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}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,img{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after{content:"";content:none}q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}:focus{outline:none}img{-moz-user-select:-moz-none;-ms-user-select:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}body{font-family:"Hind",Arial,Helvetica,"STHeiti Light","Heiti TC","微軟正黑體","Microsoft JhengHei",sans-serif;line-height:1.5;letter-spacing:1px;color:#666;-webkit-text-size-adjust:100%}a{text-decoration:none;color:#000}a:hover{color:#999}.header{position:fixed;top:10vh;bottom:5vh;left:5vw;z-index:10}.header-nav{margin-top:6vh}.header-nav .en{font-family:"Marcellus",serif;opacity:0}.header-nav .tw{font-size:.875em;position:absolute;top:0;left:0;-moz-transform:translateY(15%);-ms-transform:translateY(15%);-webkit-transform:translateY(15%);transform:translateY(15%)}.header-nav .en,.header-nav .tw{-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.header-nav a{position:relative;display:block}.header-nav a:before{content:"";width:4vw;height:1px;background:#999;opacity:.5;position:absolute;top:50%;margin-top:-2px;left:-5vw;-moz-transform-origin:right center;-ms-transform-origin:right center;-webkit-transform-origin:right center;transform-origin:right center;-moz-transform:scale(0, 1);-ms-transform:scale(0, 1);-webkit-transform:scale(0, 1);transform:scale(0, 1);-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.header-nav a:hover .en{opacity:1}.header-nav a:hover .tw{opacity:0}.header-nav a:hover:before{-moz-transform-origin:left center;-ms-transform-origin:left center;-webkit-transform-origin:left center;transform-origin:left center;-moz-transform:scale(1);-ms-transform:scale(1);-webkit-transform:scale(1);transform:scale(1)}.header-nav a{margin:5px 0}.header-nav li{opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:opacity .6s,-moz-transform .6s;-o-transition:opacity .6s,-o-transform .6s;-webkit-transition:opacity .6s,-webkit-transform .6s;transition:opacity .6s,transform .6s}.show-page .header-nav li{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.show-page .header-nav li:nth-child(2){-moz-transition-delay:.1s;-o-transition-delay:.1s;-webkit-transition-delay:.1s;transition-delay:.1s}.show-page .header-nav li:nth-child(3){-moz-transition-delay:.2s;-o-transition-delay:.2s;-webkit-transition-delay:.2s;transition-delay:.2s}.show-page .header-nav li:nth-child(4){-moz-transition-delay:.3s;-o-transition-delay:.3s;-webkit-transition-delay:.3s;transition-delay:.3s}.show-page .header-nav li:nth-child(5){-moz-transition-delay:.4s;-o-transition-delay:.4s;-webkit-transition-delay:.4s;transition-delay:.4s}.show-page .header-nav li:nth-child(6){-moz-transition-delay:.5s;-o-transition-delay:.5s;-webkit-transition-delay:.5s;transition-delay:.5s}.show-page .header-nav li:nth-child(7){-moz-transition-delay:.6s;-o-transition-delay:.6s;-webkit-transition-delay:.6s;transition-delay:.6s}.header-copyright{position:absolute;bottom:0;font-size:.75em;white-space:nowrap;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.show-page .header-copyright{opacity:1}.onscroll .header-copyright{opacity:0;pointer-events:none}.logo{opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.show-page .logo{opacity:1}.logo-text{font-size:14px;color:#000;padding:5px 0;display:inline-block}.nav{position:fixed;top:10vh;right:5vw;z-index:11}.nav-wrap{position:fixed;top:0;right:0;height:100vh;width:calc(140px + 5vw * 2);min-width:320px;background:#eee;padding:10vh 5vw;box-sizing:border-box;-moz-transform:translateX(100%);-ms-transform:translateX(100%);-webkit-transform:translateX(100%);transform:translateX(100%);-moz-transition:-moz-transform 1s;-o-transition:-o-transform 1s;-webkit-transition:-webkit-transform 1s;transition:transform 1s;text-align:right}.nav-wrap .en{font-family:"Marcellus",serif;opacity:0}.nav-wrap .tw{font-size:.875em;position:absolute;top:0;right:0;-moz-transform:translateY(15%);-ms-transform:translateY(15%);-webkit-transform:translateY(15%);transform:translateY(15%)}.nav-wrap .en,.nav-wrap .tw{-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.nav-wrap a{position:relative;display:block}.nav-wrap a:before{content:"";width:4vw;height:1px;background:#999;opacity:.5;position:absolute;top:50%;margin-top:-2px;right:-5vw;-moz-transform-origin:left center;-ms-transform-origin:left center;-webkit-transform-origin:left center;transform-origin:left center;-moz-transform:scale(0, 1);-ms-transform:scale(0, 1);-webkit-transform:scale(0, 1);transform:scale(0, 1);-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.nav-wrap a:hover .en{opacity:1}.nav-wrap a:hover .tw{opacity:0}.nav-wrap a:hover:before{-moz-transform-origin:right center;-ms-transform-origin:right center;-webkit-transform-origin:right center;transform-origin:right center;-moz-transform:scale(1);-ms-transform:scale(1);-webkit-transform:scale(1);transform:scale(1)}.nav-open .nav-wrap{-moz-transform:translateX(0);-ms-transform:translateX(0);-webkit-transform:translateX(0);transform:translateX(0)}.nav-main{margin-top:10vh}.nav-main a{color:#000;margin:10px 0}.nav-sub{margin-top:6vh}.nav-sub a{color:#999;margin:5px 0 5px 10px;line-height:20px}.nav-sub a:hover{color:#000}.hamburger{position:relative;cursor:pointer;margin:15px 0;z-index:2;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.show-page .hamburger{opacity:1}.hamburger-bar{width:30px;height:2px;background:#000;margin:5px 0;-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.hamburger-bar:before{content:"";display:block;height:100%;width:0;background:#ccc}.hamburger-bar:nth-child(2){margin-left:-10px}.hamburger:hover .hamburger-bar:before{-moz-animation:hamburgerbar 1s;-webkit-animation:hamburgerbar 1s;animation:hamburgerbar 1s}.hamburger:hover .hamburger-bar:nth-child(2){-moz-transform:translateX(10px);-ms-transform:translateX(10px);-webkit-transform:translateX(10px);transform:translateX(10px)}.nav-open .hamburger:hover .hamburger-bar:nth-child(2){-moz-transform:translateX(10px) scaleX(0);-ms-transform:translateX(10px) scaleX(0);-webkit-transform:translateX(10px) scaleX(0);transform:translateX(10px) scaleX(0)}.hamburger:hover .hamburger-bar:nth-child(2):before{-moz-animation-delay:.2s;-webkit-animation-delay:.2s;animation-delay:.2s}.hamburger:hover .hamburger-bar:nth-child(3):before{-moz-animation-delay:.4s;-webkit-animation-delay:.4s;animation-delay:.4s}.nav-open .hamburger-bar{background:#ccc}.nav-open .hamburger-bar:nth-child(2){-moz-transform:translateX(10px) scaleX(0);-ms-transform:translateX(10px) scaleX(0);-webkit-transform:translateX(10px) scaleX(0);transform:translateX(10px) scaleX(0)}.nav-open .hamburger-bar:nth-child(1){-moz-transform:translateY(7px) rotate(45deg);-ms-transform:translateY(7px) rotate(45deg);-webkit-transform:translateY(7px) rotate(45deg);transform:translateY(7px) rotate(45deg)}.nav-open .hamburger-bar:nth-child(3){-moz-transform:translateY(-7px) rotate(-45deg);-ms-transform:translateY(-7px) rotate(-45deg);-webkit-transform:translateY(-7px) rotate(-45deg);transform:translateY(-7px) rotate(-45deg)}@-moz-keyframes hamburgerbar{0%{width:0;margin-left:0}50%{width:100%;margin-left:0}100%{width:0;margin-left:100%}}@-webkit-keyframes hamburgerbar{0%{width:0;margin-left:0}50%{width:100%;margin-left:0}100%{width:0;margin-left:100%}}@keyframes hamburgerbar{0%{width:0;margin-left:0}50%{width:100%;margin-left:0}100%{width:0;margin-left:100%}}.wrapper{overflow:hidden}.main{min-height:100vh}section{padding:0 5vw}.content{position:relative;padding:7vw 160px}.title{font-weight:normal;color:#000;margin:60px 0}.title .en{font-size:1.5rem;font-family:"Marcellus",serif;opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:-moz-transform .6s,opacity .6s;-o-transition:-o-transform .6s,opacity .6s;-webkit-transition:-webkit-transform .6s,opacity .6s;transition:transform .6s,opacity .6s}.title .tw{font-size:1.25rem;opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:-moz-transform .6s .3s,opacity .6s .3s;-o-transition:-o-transform .6s .3s,opacity .6s .3s;-webkit-transition:-webkit-transform .6s,opacity .6s;-webkit-transition-delay:.3s,.3s;transition:transform .6s .3s,opacity .6s .3s}.title.show .tw,.title.show .en{display:inline-block;opacity:1;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}.subtitle{font-weight:normal;color:#000;margin:60px 0}.subtitle .en{font-size:1.25rem;font-family:"Marcellus",serif}.subtitle .tw{font-size:1.125rem;margin:0 10px}.btn{font-size:14px;margin:60px 0}.btn a{display:inline-block;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.btn a:after{content:"";display:block;height:1px;background:#999}.btn a:hover:after{-moz-animation:btnline 1s;-webkit-animation:btnline 1s;animation:btnline 1s}.btn.show a{opacity:1}@-moz-keyframes btnline{0%{width:100%;margin-left:0}50%{width:0%;margin-left:100%}50.1%{width:0;margin-left:0}100%{width:100%;margin-left:0}}@-webkit-keyframes btnline{0%{width:100%;margin-left:0}50%{width:0%;margin-left:100%}50.1%{width:0;margin-left:0}100%{width:100%;margin-left:0}}@keyframes btnline{0%{width:100%;margin-left:0}50%{width:0%;margin-left:100%}50.1%{width:0;margin-left:0}100%{width:100%;margin-left:0}}.footer{padding:5vh 5vw;background:#eee}.footer-inner{margin:0 160px;font-size:.75em;overflow:hidden;color:#666}.footer-copyright{float:left}.footer-copyright span{display:block}.footer-webdesign{float:right;margin-top:.5625em}.footer a{color:#666}.footer a:hover{color:#000}.scroll{position:fixed;bottom:5vh;right:5vw;overflow:hidden;height:60px;width:60px;margin-right:-10px;border-radius:50%;border:#000 solid 1px;cursor:pointer;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.show-page .scroll{opacity:1}.scroll:hover{opacity:.5}.scroll-down,.scroll-up{position:relative;padding:18px 30px;-moz-transition:-moz-transform .6s;-o-transition:-o-transform .6s;-webkit-transition:-webkit-transform .6s;transition:transform .6s}.scroll-down:before,.scroll-up:before{content:"";width:1px;height:24px;background:#000;display:block}.scroll-down:after,.scroll-up:after{content:"";border-left:transparent solid 3px;border-right:transparent solid 4px;position:absolute;left:50%;margin-left:-3px}.up .scroll-down,.up .scroll-up{-moz-transform:translateY(-100%);-ms-transform:translateY(-100%);-webkit-transform:translateY(-100%);transform:translateY(-100%)}.scroll-down:after{border-top:#000 solid 6px;bottom:18px}.scroll-up:after{border-bottom:#000 solid 6px;top:18px}@media screen and (max-width: 1100px){.header{top:20px;bottom:auto}.header-nav,.header-copyright{display:none}.logo img,.logo svg{height:50px}.logo-text{display:none}.nav{top:20px}.nav-wrap{padding:20px 5vw}.hamburger{margin:18px 0}.hamburger-bar{width:25px;height:1px}.hamburger-bar:nth-child(2){margin-left:-5px}.nav-open .hamburger-bar:nth-child(1){-moz-transform:translateY(6px) rotate(45deg);-ms-transform:translateY(6px) rotate(45deg);-webkit-transform:translateY(6px) rotate(45deg);transform:translateY(6px) rotate(45deg)}.nav-open .hamburger-bar:nth-child(3){-moz-transform:translateY(-6px) rotate(-45deg);-ms-transform:translateY(-6px) rotate(-45deg);-webkit-transform:translateY(-6px) rotate(-45deg);transform:translateY(-6px) rotate(-45deg)}.content{padding:7vw 0}.title{line-height:1.2}.title .en{font-size:1.25rem}.title .tw{font-size:1.125rem}.footer{padding:20px 5vw}.footer-inner{margin:0 60px 0 0}.scroll{width:40px;height:40px;bottom:20px;margin-right:-7px}.scroll-down,.scroll-up{padding:8px 20px}.scroll-down:after{bottom:8px}.scroll-up:after{top:8px}}@media screen and (max-width: 640px){.nav-wrap{width:100%}.content{padding:60px 0}.footer-copyright,.footer-webdesign{float:none}.footer-webdesign{margin-top:0}.footer-copyright span{display:inline-block}}.intro{position:fixed;top:0;width:100%;height:100%;z-index:15;background:#FFF}.intro-logo{width:60px;height:80px;position:absolute;top:50%;left:50%;margin:-40px 0 0 -30px}.intro-logo1{position:relative;width:60px;height:50px}.intro-logo1-over{position:absolute;top:0;left:0;height:100%;width:0;-moz-transition:width 2s;-o-transition:width 2s;-webkit-transition:width 2s;transition:width 2s;overflow:hidden}.show-intro .intro-logo1-over{width:100%}.intro-logo2{opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:opacity .6s 2s,-moz-transform .6s 2s;-o-transition:opacity .6s 2s,-o-transform .6s 2s;-webkit-transition:opacity .6s,-webkit-transform .6s;-webkit-transition-delay:2s,2s;transition:opacity .6s 2s,transform .6s 2s}.show-intro .intro-logo2{opacity:1;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}.intro-logo3{opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:opacity .6s 2.4s,-moz-transform .6s 2.4s;-o-transition:opacity .6s 2.4s,-o-transform .6s 2.4s;-webkit-transition:opacity .6s,-webkit-transform .6s;-webkit-transition-delay:2.4s,2.4s;transition:opacity .6s 2.4s,transform .6s 2.4s}.show-intro .intro-logo3{opacity:1;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}.top-content{padding:10vh 100px 5vh 160px}.top-line{position:absolute;top:0%;left:50%;width:1px;height:100%;background:#ddd}.top-images{position:relative;height:calc(100vh - 15vh);opacity:0;-moz-transition:opacity 1s .6s;-o-transition:opacity 1s .6s;-webkit-transition:opacity 1s;-webkit-transition-delay:.6s;transition:opacity 1s .6s}.show-page .top-images{opacity:1}.top-images li{position:absolute;top:0;width:100%;height:100%}.top-images-bg{position:absolute;width:100%;height:100%;background:#eee}.top-images-inner{position:absolute;top:0;width:100%;height:100%;background-size:cover;background-position:center;-moz-transition:background 10s;-o-transition:background 10s;-webkit-transition:background 10s;transition:background 10s}.top-img1{background-position:50% 100%}.show-img .top-img1{background-position:20% 0}.top-img2{background-position:50% 0}.show-img .top-img2{background-position:30% 100%}.top-img3{background-position:40% 0}.show-img .top-img3{background-position:60% 100%}.top-img4{background-position:50% 100%}.show-img .top-img4{background-position:20% 0}.top-img5{background-position:50% 0}.show-img .top-img5{background-position:20% 100%}.top-img6{background-position:40% 100%}.show-img .top-img6{background-position:60% 0}.top-img7{background-position:50% 0}.show-img .top-img7{background-position:30% 100%}.top-text{position:absolute;left:5%;bottom:30%;font-family:"Marcellus",serif;font-size:2em;color:#FFF;text-shadow:1px 1px 2px #000;width:90%}.top-text span{display:inline-block;margin:0 7px;opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:opacity 1s 1s,-moz-transform 1s 1s;-o-transition:opacity 1s 1s,-o-transform 1s 1s;-webkit-transition:opacity 1s,-webkit-transform 1s;-webkit-transition-delay:1s,1s;transition:opacity 1s 1s,transform 1s 1s}.show-img .top-text span{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.top-text span:nth-child(2){-moz-transition-delay:1.2s;-o-transition-delay:1.2s;-webkit-transition-delay:1.2s;transition-delay:1.2s}.top-text span:nth-child(3){-moz-transition-delay:1.4s;-o-transition-delay:1.4s;-webkit-transition-delay:1.4s;transition-delay:1.4s}.company-content{text-align:center}.company-line{position:absolute;left:50%;width:1px;height:7vw;background:#ddd}.company-line.line-b{bottom:0}.company-line.line-t{top:0}.company-text{font-size:.95em;max-width:800px;margin:60px auto;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.company-text.show{opacity:1}.company-images{position:relative;display:-ms-flexbox;display:flex;-webkit-align-items:center;align-items:center;padding:7vw 200px}.company-images-line{position:absolute;top:0;left:50%;width:1px;height:100%;background:#ddd}.company-images-img1{width:45%;margin-right:5%;opacity:0;-moz-transform:translateY(-40px);-ms-transform:translateY(-40px);-webkit-transform:translateY(-40px);transform:translateY(-40px);-moz-transition:opacity .6s,-moz-transform .6s;-o-transition:opacity .6s,-o-transform .6s;-webkit-transition:opacity .6s,-webkit-transform .6s;transition:opacity .6s,transform .6s}.company-images-img1.show{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.company-images-img2{width:40%;margin-left:10%;opacity:0;-moz-transform:translateY(40px);-ms-transform:translateY(40px);-webkit-transform:translateY(40px);transform:translateY(40px);-moz-transition:opacity .6s,-moz-transform .6s;-o-transition:opacity .6s,-o-transform .6s;-webkit-transition:opacity .6s,-webkit-transform .6s;transition:opacity .6s,transform .6s}.company-images-img2.show{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.company-images img{width:100%}.project-content{text-align:center}.project-line{position:absolute;left:50%;width:1px;height:7vw;background:#ddd}.project-line.line-b{bottom:0}.project-line.line-t{top:0}.project-list{display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;-webkit-align-items:flex-start;align-items:flex-start;margin:-3%}.project-item{position:relative;width:27.3333%;margin:3%;padding:0 0 1% 40px;box-sizing:border-box;opacity:0;-moz-transform:translateY(40px);-ms-transform:translateY(40px);-webkit-transform:translateY(40px);transform:translateY(40px);-moz-transition:opacity .6s,-moz-transform .6s;-o-transition:opacity .6s,-o-transform .6s;-webkit-transition:opacity .6s,-webkit-transform .6s;transition:opacity .6s,transform .6s}.project-item.show{opacity:1;-moz-transform:translateY(0px);-ms-transform:translateY(0px);-webkit-transform:translateY(0px);transform:translateY(0px)}.project-item:nth-child(3n+2){margin:13% 3% 3%}.project-item:nth-child(3n+3){margin:7% 3% 3%}.project-img{position:relative;overflow:hidden}.project-img img{width:100%;-moz-transition:-moz-transform 1s;-o-transition:-o-transform 1s;-webkit-transition:-webkit-transform 1s;transition:transform 1s}.project-item:hover .project-img img{-moz-transform:scale(1.1);-ms-transform:scale(1.1);-webkit-transform:scale(1.1);transform:scale(1.1)}.project-img:after{content:"";position:absolute;top:0;left:0;width:80%;height:100%;background:#000;opacity:0;-moz-transition:width .6s,opacity .6s;-o-transition:width .6s,opacity .6s;-webkit-transition:width .6s,opacity .6s;transition:width .6s,opacity .6s}.project-item:hover .project-img:after{opacity:.4;width:100%}.project-view{position:absolute;top:50%;width:100%;color:#FFF;z-index:1;opacity:0;-moz-transform:translateY(-50%);-ms-transform:translateY(-50%);-webkit-transform:translateY(-50%);transform:translateY(-50%);-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.project-item:hover .project-view{opacity:1}.project-sort{position:absolute;top:-.65625em;left:15px;-moz-transform-origin:left center;-ms-transform-origin:left center;-webkit-transform-origin:left center;transform-origin:left center;-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);transform:rotate(90deg);font-size:.875em;color:#999;background:#FFF;padding-right:10px}.project-name{text-align:right;padding:10px 0;font-size:.95em}.project-box{position:absolute;left:15px;width:calc(100% - 15px);height:100%;border-left:#ddd solid 1px;border-bottom:#ddd solid 1px}.service-line{position:absolute;top:calc(7vw + 1.5em * 1.5 + 10px);left:50%;width:1px;height:calc(100% - 7vw * 2 - 1.5em * 1.5 - 40px);background:#ddd}.service-title{text-align:center;margin-top:0}.service-btn{margin-bottom:0;text-align:center}.service-list{width:80%;max-width:70vh;margin:auto;overflow:visible;position:relative}.service-list img{width:100%}.service-item{position:relative}.service-item:after{content:"";position:absolute;top:0;width:100%;height:100%;background:#eee;-moz-transition:width 1s;-o-transition:width 1s;-webkit-transition:width 1s;transition:width 1s}.show .service-item:after{width:0}.service-img{clip-path:polygon(100% 0, 100% 0%, 100% 100%, 100% 100%);-webkit-clip-path:polygon(100% 0, 100% 0%, 100% 100%, 100% 100%);-moz-transition:clip-path .6s 1s;-o-transition:clip-path .6s 1s;-webkit-transition:clip-path .6s;-webkit-transition-delay:1s;transition:clip-path .6s 1s}.swiper-slide-active .service-img{clip-path:polygon(0% 0, 100% 0%, 100% 100%, 0% 100%);-webkit-clip-path:polygon(0% 0, 100% 0%, 100% 100%, 0% 100%);-moz-transition-delay:0s;-o-transition-delay:0s;-webkit-transition-delay:0s;transition-delay:0s}.service-text{position:absolute;top:0;left:-5%;font-size:.95em;-moz-transform-origin:left top;-ms-transform-origin:left top;-webkit-transform-origin:left top;transform-origin:left top;-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);transform:rotate(90deg);opacity:0;white-space:nowrap;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.service-text .tw{display:inline-block;-moz-transform:rotate(-90deg) translateX(3px);-ms-transform:rotate(-90deg) translateX(3px);-webkit-transform:rotate(-90deg) translateX(3px);transform:rotate(-90deg) translateX(3px);letter-spacing:6px}.swiper-slide-active .service-text{opacity:1;-moz-transition-delay:.6s;-o-transition-delay:.6s;-webkit-transition-delay:.6s;transition-delay:.6s}.service .swiper-pagination-bullets{position:absolute;left:105%;width:auto}.service .swiper-pagination-bullet:hover{opacity:.5}.service .swiper-pagination-bullet-active{background:#000}.technology-content{text-align:center}.technology-line{position:absolute;left:50%;width:1px;height:7vw;background:#ddd}.technology-line.line-b{bottom:0}.technology-line.line-t{top:0}.technology-subtitle{background:#eee;color:#000;padding-top:5px;padding-left:8px;margin-bottom:5%;margin-top:5%;text-align:left;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.technology-subtitle.show{opacity:1}.technology-list{display:-ms-flexbox;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap;margin:-2.5%}.technology-list li{width:18%;margin:1%;border:#ddd solid 1px;padding:20px;box-sizing:border-box;opacity:0;-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.technology-list li.show{opacity:1}.technology-list img{width:80%;margin:auto}.technology-text{margin-top:20px;font-size:.95em;display:inline-block}.technology-text:after{content:"";display:block;height:1px;background:#999}.news-title{margin-top:0;text-align:center}.news-list{display:-ms-flexbox;display:flex;margin:-3%}.news-item{position:relative;border-left:#ddd solid 1px;padding:0 20px 60px;width:27.3333%;margin:3%;box-sizing:border-box}.news-item:after{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#FFF;-moz-transition:width 1s;-o-transition:width 1s;-webkit-transition:width 1s;transition:width 1s}.news-item.show:after{width:0}.news-img{overflow:hidden}.news-img img{width:100%;-moz-transition:-moz-transform 1s;-o-transition:-o-transform 1s;-webkit-transition:-webkit-transform 1s;transition:transform 1s}.news-item:hover .news-img img{-moz-transform:scale(1.1);-ms-transform:scale(1.1);-webkit-transform:scale(1.1);transform:scale(1.1)}.news-info{margin-top:10px;font-size:.95em}.news-year{color:#999}.news-view{position:absolute;font-size:.875em;bottom:0;right:40px;opacity:0;-moz-transition:opacity .6s,right .6s;-o-transition:opacity .6s,right .6s;-webkit-transition:opacity .6s,right .6s;transition:opacity .6s,right .6s}.show .news-view{opacity:1;right:20px;-moz-transition-delay:.6s;-o-transition-delay:.6s;-webkit-transition-delay:.6s;transition-delay:.6s}.news-view:after{content:"";display:block;height:1px;background:#666}.innerimage{padding:0;overflow:hidden}.innerimage-img{position:relative;padding-bottom:35vw;background-size:cover;background-position:0 0}.consultation-content{text-align:center}.consultation a{position:relative;display:inline-block;font-size:1.5em;color:#000;opacity:0;-moz-transform:translateY(20px);-ms-transform:translateY(20px);-webkit-transform:translateY(20px);transform:translateY(20px);-moz-transition:-moz-transform .6s .3s,opacity .6s .3s;-o-transition:-o-transform .6s .3s,opacity .6s .3s;-webkit-transition:-webkit-transform .6s,opacity .6s;-webkit-transition-delay:.3s,.3s;transition:transform .6s .3s,opacity .6s .3s}.consultation a.show{opacity:1;-moz-transform:translateY(0);-ms-transform:translateY(0);-webkit-transform:translateY(0);transform:translateY(0)}.consultation a .en{display:inline-block;font-family:"Marcellus",serif;opacity:0}.consultation a .tw{position:absolute;left:50%;top:5px;white-space:nowrap;-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);-webkit-transform:translateX(-50%);transform:translateX(-50%);font-size:.875em}.consultation a .en,.consultation a .tw{-moz-transition:opacity .6s;-o-transition:opacity .6s;-webkit-transition:opacity .6s;transition:opacity .6s}.consultation a .en:after,.consultation a .tw:after{content:"";display:block;height:1px;background:#000}.consultation a:hover .en{opacity:1}.consultation a:hover .tw{opacity:0}@media screen and (min-width: 1301px){.technology-list li.show:nth-child(5n+1){-moz-transition-delay:.1s;-o-transition-delay:.1s;-webkit-transition-delay:.1s;transition-delay:.1s}.technology-list li.show:nth-child(5n+2){-moz-transition-delay:.2s;-o-transition-delay:.2s;-webkit-transition-delay:.2s;transition-delay:.2s}.technology-list li.show:nth-child(5n+3){-moz-transition-delay:.3s;-o-transition-delay:.3s;-webkit-transition-delay:.3s;transition-delay:.3s}.technology-list li.show:nth-child(5n+4){-moz-transition-delay:.4s;-o-transition-delay:.4s;-webkit-transition-delay:.4s;transition-delay:.4s}.technology-list li.show:nth-child(5n+5){-moz-transition-delay:.5s;-o-transition-delay:.5s;-webkit-transition-delay:.5s;transition-delay:.5s}}@media screen and (max-width: 1300px) and (min-width: 861px){.technology-list li.show:nth-child(3n+1){-moz-transition-delay:.1s;-o-transition-delay:.1s;-webkit-transition-delay:.1s;transition-delay:.1s}.technology-list li.show:nth-child(3n+2){-moz-transition-delay:.2s;-o-transition-delay:.2s;-webkit-transition-delay:.2s;transition-delay:.2s}.technology-list li.show:nth-child(3n+3){-moz-transition-delay:.3s;-o-transition-delay:.3s;-webkit-transition-delay:.3s;transition-delay:.3s}}@media screen and (max-width: 1300px) and (min-width: 1101px){.project-item{width:44%}.project-item:nth-child(2n+1){margin:3%}.project-item:nth-child(2n+2){margin:13% 3% 3%}.technology-list li{width:28.3333%;margin:2.5%}.news-list{margin:-1.5%}.news-item{padding-right:0;width:30.3333%;margin:1.5%}}@media screen and (max-width: 1100px){.top{padding:0}.top-content{padding:90px 0 0;overflow:hidden}.top-line{top:50%;height:50%}.top-images{height:calc(100vh - 90px)}.top-images-bg{visibility:hidden}.top-text{font-size:1.5em}.company-images{padding:7vw 0}.technology-list li{width:28.3333%;margin:2.5%}.consultation a{font-size:1.25em}}@media screen and (max-width: 860px){.project-item{width:44%}.project-item:nth-child(2n+1){margin:3%}.project-item:nth-child(2n+2){margin:13% 3% 3%}.technology-list li{padding:20px 10px}.news-list{margin:0;display:block}.news-item{width:auto;border-left:none;border-bottom:#ddd solid 1px;padding:0 0 30px 0;margin-bottom:30px}.news-item a{display:-ms-flexbox;display:flex;-webkit-align-items:flex-start;align-items:flex-start}.news-img{width:30%}.news-info{width:65%;margin-left:5%;margin-top:0}.news-view{bottom:-1px}.innerimage img{width:120%;margin-left:-10%}}@media screen and (max-width: 640px){.company-line,.project-line,.technology-line{height:60px}.service-line{top:calc(60px + 1.5em * 1.5 + 10px);height:calc(100% - 60px * 2 - 1.5em * 1.5 - 40px)}.company-images{display:block}.company-images-img1{position:relative;width:auto;margin:0}.company-images-img2{display:none}.project-list{margin:-20px auto;max-width:400px}.project-item{width:auto}.project-item:nth-child(2n+2),.project-item:nth-child(2n+1){margin:20px 0}.technology-list{margin:-1%}.technology-list li{width:48%;margin:1%}.technology-list img{width:90%}}
