@charset "utf-8";@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);.asp{width:100%;height:100%}
body{font-family:'Noto Sans TC',"Microsoft JhengHei",sans-serif;-webkit-overflow-scrolling:touch;overflow-x:hidden}
#header{height:110px}
.right{text-align:right}
.auto{margin:0 auto}
.lg-word{font-size:1.6rem}
.xl-p{font-size:3.8rem}
.gary-under{background-color:#ebecee}
.col-3.timer{padding:0}
#header .container-fluid,#header .row{height:inherit}
#header h1{margin:0}
.fullBg{width:100%!important}
.sidenav-brand{background:#1d8db5!important;border-bottom:1px solid #136a89!important}
#searchui .nav-tabs{border-bottom:none}
figure#center-fblogo,figure#logo{margin:0;text-align:center}
#header h3{font-size:1rem;color:#666;margin:0}
#header h3 i{margin-right:5px}
#header h2 a{color:#cf1619;font-size:2.2rem;text-decoration:none;margin:5px 0 0 0;font-weight:700;}
#nav{background:#141414}
select#ide,select#resumeGuid {text-align: center;text-align-last: center;}
nav#nav>ul{padding:0;position:relative;margin:0;list-style-type:none;display:flex}
nav#lgnav ul{padding:0 0 15px 0;margin:0;list-style-type:none;display:flex;border-bottom:dashed 2px #ccc}
nav#nav>ul>li{width:20vw;padding:2.5vh 0}
nav#lgnav ul>li{width:20vw;padding:1.5vh 0;position:relative}
nav#lgnav ul>li:first-child:before{content:'No Work Experience';position:absolute;font-size:.85rem;display:block;width:100%;font-weight:500;bottom:-5px;text-align:center;color:#999}
nav#lgnav ul>li:nth-child(2):before{content:'High Salaries';font-size:.85rem;position:absolute;width:100%;font-weight:500;bottom:-5px;text-align:center;color:#999}
#tips-block{background-color:rgba(0,0,0,.2);width:100vw;height:100vh;position:fixed;top:0;transition:all .5s ease;left:0;opacity:0;z-index:2}
#tipsmessage{background-color:#333;color:#fff;font-size:1rem;opacity:0;transition:all .5s ease;position:absolute;z-index:3;transform:translateY(-20px);text-align:center;padding:5px;width:45%}
#tipsmessage.vis{opacity:1;transition:all .5s ease;transform:translateY(0)}
a#messages{color:#fff;background-color:#7ad2f0;padding:5px;text-align:center;text-decoration:none;display:block}
nav#lgnav ul>li:nth-child(3):before{content:'Year-end Bonus';font-size:.85rem;position:absolute;width:100%;bottom:-5px;font-weight:500;text-align:center;color:#999}
nav#lgnav ul>li:nth-child(4):before{content:'Top Enterprises';font-size:.85rem;position:absolute;width:100%;bottom:-5px;font-weight:500;text-align:center;color:#999}
nav#lgnav ul>li:nth-child(5):before{content:'Job Opportunities';font-size:.85rem;position:absolute;width:100%;bottom:-5px;font-weight:500;text-align:center;color:#999}
nav#lgnav ul>li span{display:block;font-size:.9rem;color:#999}
nav#lgnav ul>li a{font-size:1.8rem;color:#999;display:block;text-align:center;text-decoration:none;position:relative;letter-spacing:2px;border-right:#666 solid 1px;font-weight:300}
nav#lgnav ul>li a:before{content:'';height:5px;width:100%;position:absolute;background-color:#54b3e5;bottom:0;left:50%;transform:translateX(-50%);opacity:0;transition:all .5s ease}
nav#lgnav ul>li a:hover:before{content:'';height:5px;width:50%;position:absolute;background-color:#54b3e5;bottom:0;left:50%;transition:all .5s ease;transform:translateX(-50%);opacity:1}
nav#lgnav ul>li:last-child a{border-right:none}
nav#nav>ul>li>a{color:#fff;border-right:#666 solid 1px;display:block;font-size:1.2rem;text-align:center;text-decoration:none;position:relative}
.collet-tips{text-align:center}
a.btn.btn-default.seelist{background-color:#1e8cb5;color:#fff;margin:15px 0;width:100%;padding:15px 0;font-size:1.25rem}
.last-tips{align-self:center;text-align:center;font-size:1.6rem;font-weight:700;color:#333}
.last-tips2{text-align:center;font-size:1.6rem;font-weight:700;color:#333}
.sidenav-brand a{color:#fff;text-decoration:none}
#room1 a,#room2 a{display:block;position:relative}
#room1 a span{position:absolute;left:0;top:0;background-color:rgba(0,0,0,.7);width:100%;opacity:0;transition:all .5s ease;padding:5px 0 5px 10px;color:#fff;font-size:1.8rem}
#room2 a span{position:absolute;left:0;bottom:0;background-color:rgba(0,0,0,.7);width:100%;opacity:0;transition:all .5s ease;padding:5px 0 5px 10px;color:#fff;font-size:1.8rem}
#room1 a:hover span,#room2 a:hover span{opacity:1;transition:all .5s ease}
#room1{margin:0 0 15px 0}
#room1 ul,#room2 ul{padding:0;list-style-type:none;margin:0}
#room1 ul li,#room2 ul li{float:left;padding:0 8px}
#room1 ul li a,#room2 ul li a{cursor:default}
#room1,#room2{overflow:hidden}
nav#lgnav{margin:35px 0}
aside#searchui{width:65vw;min-height:15vh;position:absolute;transition:all .5s ease;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%)}
section#sliderbox{position:relative}
#searchui .nav-tabs .nav-item{margin-bottom:0;padding:0;border-radius:0;transform:translateY(6px)}
#searchui .nav-tabs .nav-link.active{background-color:rgba(255,255,255,.9);border:none;padding:.7rem 1rem;color:#333;transform:translateY(-6px);border-radius:0 8px 0 0;font-size:1.4rem}
#searchui .nav-link{color:#333;margin-right:1px;border-radius:0 8px 0 0;text-align:center;font-size:1.4rem;border:none;background-color:rgba(255,255,255,.6);transition:all .5s ease}
#searchui .nav-link:hover{color:#fff;font-size:1.4rem;border:none;background-color:#666;transition:all .5s ease}
.picture-p{font-size:2.5rem;margin:0 0 5px 0}
section#graybox p{margin:0;color:#333}
.sm-p{font-size:2rem;font-weight:500}
.md-p{font-size:2.5rem}
i.fa.fa-search{margin-right:5px}
div#myTabContent .row:last-child{margin-top:15px}
#myTabContent span{padding:0;margin-right:10px}
#myTabContent span:last-child{margin-right:0}
div#myTabContent{padding:25px;background-color:rgba(255,255,255,.9)}
#contact input.form-control.form-control-lg,#home input.form-control.form-control-lg,#profile input.form-control.form-control-lg{background-color:#fff;cursor:pointer}
input.form-control.form-control-lg{padding:.5rem 1rem .5rem 3rem;background-color:#efefef}
input.form-control.form-control-lg.col.keyin{color:#333;margin-right:12px}
input#searchbtn{border-radius:4px;background-color:#a5070b;border:none;max-width:24%;font-size:1.4rem;cursor:pointer}
input#searchbtn:hover{background-color:#b53437}
.navicon{position:absolute;top:12px;color:grey;left:10px;font-size:1.4rem}
div#myTabContent i.fa.fa-search{position:absolute;top:12px;color:grey;left:15px;font-size:1.4rem}
.menubox{background-color:rgba(255,255,255,.9);position:absolute;top:100%;display:none;left:50%;transform:translateX(-50%);z-index:50;width:95%;height:25vh}
#nav .col-3.align-self-center{text-align:center}
.menubox .row{height:inherit}
ul.menulist{padding:0;margin:0;list-style-type:none;display:flex}
ul.menulist>li{color:#000;width:25%}
ul.menulist>li a{color:#333;text-decoration:none;font-size:1.2rem;letter-spacing:1.5px}
ul.menulist>li a:hover{color:#ad070b;text-decoration:none}
ul.menulist>li a i{color:#ad070b;margin-right:13px}
ul.menulist>li a i.fa.fa-external-link{color:#333;margin-left:5px}
.menutitle{font-weight:700;font-size:1.6rem;margin:25px 0}
nav#nav>ul>li>a:before{background-color:#ad070b;content:'';width:0;height:5px;bottom:-5px;z-index:10;display:block;position:absolute;left:10%;transition:all .5s ease}
nav#nav>ul>li>a:hover:before{background-color:#ad070b;content:'';width:50%;height:5px;bottom:-5px;z-index:10;display:block;position:absolute;left:10%;transition:all .5s ease}
nav#nav>ul>li>a:after{background-color:#ad070b;content:'';width:0;height:5px;bottom:-5px;z-index:10;display:block;position:absolute;right:10%;transition:all .5s ease}
nav#nav>ul>li>a:hover:after{background-color:#ad070b;content:'';width:50%;height:5px;bottom:-5px;z-index:10;display:block;position:absolute;right:10%;transition:all .5s ease}
#nav .col-2.align-self-center:after{content:'';width:1px;height:20vh;background-color:#3d3d3d;position:absolute;right:25px;top:50%;transform:translateY(-50%)}
select.form-control.form-control-lg.selectstyle{height:48px;padding-left:40px}
.col-2.align-self-center{text-align:center}
.menubox .col-2{text-align:center;color:#333;font-size:1.4rem}
section#graybox{background-color:#eee}
svg#line1{width:100%}
section#graybox{background-color:#eee;padding:80px 0;text-align:center}
section#graybox .row{margin:25px 0}
div#firsttitle{position:absolute;font-size:2rem;width:100%;left:50%;transform:translateX(-50%);bottom:20px}
span.svgbox{display:block;position:relative;margin-right:15px}
section#graybox{background-color:#eee;padding:50px 0;text-align:center;position:relative}
section#graybox:after{content:'';width:0;height:0;border-style:solid;border-width:50px 50px 0 50px;border-color:#eee transparent transparent transparent;position:absolute;bottom:-50px;left:50%;transform:translateX(-50%)}
section#foucus{padding:80px 0 0 0}
.card.col-md.col-sm-12{padding:0;margin:0 15px;transform:scale(.95);transition:all .5s ease}
.card.col-md.col-sm-12:hover{padding:0;margin:0 15px;transform:scale(1);transition:all .5s ease}
h4.card-title{border:#1e87b0 solid 1px;text-align:center;color:#1e87b0;padding:10px 5px;font-size:1.2rem;background-color:#fff;border-radius:5px;position:relative;opacity:0;transition:all .5s ease;margin-top:-50px}
.card-body a{text-decoration:none}
.card-body a:hover h4.card-title{opacity:1;transition:all .5s ease}
h4.card-title:after{content:'';width:20px;height:20px;border:#1e87b0 solid 1px;background-color:#fff;position:absolute;border-top:none;border-left:none;left:50%;transform:translateX(-50%) rotate(45deg);bottom:-10px;z-index:2}
p.card-text{font-size:1.65rem;font-weight:700;color:#1e87b0;text-align:center}
p.card-sm-text{text-align:center;color:#666;line-height:24px}
p.card-text i{margin-left:10px;font-size:2rem;background-color:#1e87b0;width:32px;border-radius:100px;color:#fff}
svg#linetitle{width:40%}
aside#floatmenu{position:fixed;right:0;opacity:0;transition:all .5s ease;bottom:10vh;z-index:-1}
aside#floatmenu.vis{position:fixed;opacity:1;z-index:1;right:0;transition:all .5s ease}
a#join{display:block;position:relative;color:#fff;background-color:#166989;padding:5px;text-align:center;text-decoration:none}
a#edit{display:block;color:#fff;background-color:#51c5ec;padding:5px;text-align:center;text-decoration:none}
a#see{display:block;color:#fff;background-color:#1d8db5;padding:5px;text-align:center;text-decoration:none}
a#top{background-color:#fff;padding:5px 5px;display:block;text-align:center;text-decoration:none;color:#166988}
a#top img{margin:0 auto}
i.fa.fa-star.d-block{font-size:2rem;text-align:center}
nav#breadstyle{margin-top:15px}
nav#breadstyle .breadcrumb{background-color:transparent}
h3.insidetitle{border-bottom:grey solid 5px;padding-bottom:10px;font-size:3rem;position:relative;color:#232323}
figure.test-img{margin:0}
.ngbox{padding:25px 0}
.ngbox2{background-color:#eceeef;padding:5vw 0;align-self:center}
.ngbox2 ul{margin:0;padding:0;text-align:center;color:#4d4d4d;list-style-type:none;font-size:1.4rem}
.ngbox p{margin:0;text-align:center}
.ngbox p:last-child{color:#4d4d4d;font-size:1.3rem;padding-top:10px}
.ngbox p:nth-child(2){font-size:2rem;font-weight:700}
.ngbox p:nth-child(3){font-size:2rem;color:#0068af}
.ngbox .row .col-md-4{text-align:center}
h3.insidetitle:before{content:'';height:5px;width:10vw;position:absolute;bottom:-5px;background-color:#1e8cb5;z-index:5}
footer{background-color:#e3e3e3;padding:50px 0}
footer ul{padding:0;margin:0;list-style-type:none}
footer ul li{width:50%;display:inline-block;float:left}
footer ul:nth-child(2) li{width:100%;display:block}
footer ul:nth-child(4){display:flex;flex-wrap:wrap}
footer ul:nth-child(4):before{display:none}
footer ul:nth-child(4) li{margin:5px 0;text-align:center}
footer a{text-decoration:none;color:#333}
.footer-title{margin:15px 0;transform:translateX(-20px);font-size:1.4rem}
.footer-title i{margin-right:10px}
footer ul li i{margin-right:10px;color:#2b92b8}
a.findwork{background-color:#d4151a;color:#fff;display:block;text-align:center;padding:5px 0;border-radius:5px;box-shadow:#600 0 2px}
a.findperson{background-color:#9f1014;color:#fff;display:block;text-align:center;padding:5px 0;border-radius:5px;box-shadow:#600 0 2px}
footer ul:before{content:'';width:1px;height:100%;position:absolute;background-color:#ccc;right:15px}
h4.mastertitle{color:#1e8cb5;text-align:center;margin:0;font-size:3rem}
.mastertitle{color:#1e8cb5;text-align:center;margin:0;font-size:3rem}
h4.mastertitle2{color:#2b92b8;text-align:center;margin:80px 0 0 0;font-size:3rem}
.row.space{margin-bottom:25px}
aside.col-md-3.align-self-center{text-align:center}
aside.col-md-3.align-self-center a{border:#666 solid 1px;color:#666;padding:0 20px;text-decoration:none;border-radius:5px;font-size:1.3rem}
aside.col-md-3.align-self-center a i{font-size:1rem;margin-left:5px;transform:translateY(-2px)}
p.lgorang{color:#ff7329;font-size:2rem;font-weight:700}
p.lggray{color:#666;font-size:1.4rem;font-weight:700}
span.blbeline:before{height:130%;background-color:#1e8cb5;position:absolute;left:-25px;content:'';width:8px;top:-6px}
span.blbeline{position:relative;color:#1e8cb5;font-size:1.4rem}
.row.no-gutters.strengthen{background-color:#eef5fc;margin-bottom:50px}
a#start-one-point{background-color:#ff7329;font-weight:700;color:#fff;border-radius:5px;text-decoration:none;display:inline-block;padding:10px 20px;font-size:2rem;box-shadow:0 5px #c63}
a#start-one-point-fb{background-color:#3b5998;color:#fff;font-weight:700;border-radius:5px;text-decoration:none;display:inline-block;padding:10px 20px;font-size:2rem;box-shadow:0 5px #2e4473}
a#start-one-point i{margin-left:5px;font-size:.9rem;transform:translateY(-5px)}
.row.no-gutters.one-point p{margin:0}
.row.no-gutters.one-point{padding:50px 0;border:#c7c7c7 solid 1px;margin-bottom:50px}
.row.no-gutters.one-point>aside{text-align:center}
.row.no-gutters.one-point>aside>svg{width:11%;position:absolute;right:0;font-size:5rem;top:50%;transform:translateY(-50%);color:#999}
nav#breadstyle a{color:#b0b0b0}
a#sidenav-toggle{position:absolute;top:45px;left:20px;font-size:2rem;color:#666}
nav#breadstyle2 .breadcrumb{background:0 0;margin-bottom:0;padding:.75rem 0}
h1.test-lg-title{color:#fff;margin-top:25px;text-align:center}
h2.test-md-title{color:#fff;font-size:1.3rem;font-weight:300;line-height:1.5;text-align:center}
aside.formui{margin:25px 0}
span.col-md.col-sm-12:last-child{position:relative;margin-right:0}
span.col-lg.col-sm-12:last-child input{padding:.5rem 3.5rem .5rem 1.5rem;background-color:#fff}
a.startbtn{position:absolute;right:0;top:0;color:#ccc;border-left:#ccc solid 1px;height:100%;width:50px;padding-top:10px;text-align:center}
a.startbtn i{font-size:1.6rem!important}
span.col-lg.col-sm-12{margin-right:10px}
p.vicetitle{color:#666;text-align:center;margin-bottom:0;font-size:1.5rem;font-weight:300;line-height:125%}
.images-box{font-size:1.4rem;color:#666;padding:0 10px!important}
.images-box span{display:block;position:relative}
.black-all{position:absolute;color:#fff;text-align:center;width:100%;height:100%;opacity:0;padding-top:25%}
.images-box span a:before{background-color:rgba(0,0,0,.5);content:'';width:100%;height:100%;opacity:0;transition:all .5s ease;position:absolute}
.images-box span:hover a:before{opacity:1;transition:all .5s ease}
.images-box span:hover .black-all{opacity:1;transition:all .5s ease}
aside.row.no-gutters.master-box{margin-bottom:50px}
a.nextbtn{background-color:#1e8cb5;color:#fff;width:20vw;display:block;font-size:2rem;margin:15px auto;border-radius:5px;padding:8px 0;box-shadow:0 3px #14566e;text-decoration:none}
a.nextbtn i{margin-left:15px;font-size:.85rem;transform:translateY(-5px)}
.row.no-gutters.one-point.inside{margin:60px 0}
span.col-lg.col-md-4.col-sm-12 i{position:absolute;right:10px;top:15px;color:#1e8cb5;font-size:.9rem}
span.memberborder{border:#666 solid 1px;padding:1px 5px;margin-right:3px;font-weight:700}
#chosen{text-align:center;margin:0 0 60px 0;font-size:3rem;font-weight:600;color:#666}
ul#chosen-list{padding:0 10vw;margin:0;list-style-type:none}
.comp{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#666;font-weight:500;font-size:1.1rem}
.addres{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#666;font-weight:250}
ul#chosen-list .owl-next i,ul#chosen-list .owl-prev i{transform:translateY(-2px)}
ul#chosen-list .owl-next{background-color:#fff;width:38px;padding:0;border-radius:100px;border:#ccc solid 1px;color:#03A9F4;position:absolute;top:50%;right:4vw;transform:translateY(-50%)}
ul#chosen-list .owl-prev{background-color:#fff;width:38px;padding:0;border-radius:100px;border:#ccc solid 1px;color:#03A9F4;position:absolute;top:50%;left:4vw;transform:translateY(-50%);transition:all .5s ease}
ul#chosen-list .owl-next:hover,ul#chosen-list .owl-prev:hover{background-color:#03A9F4;color:#fff;transition:all .5s ease}
.list-name,.list-name a{color:#1e87b0;font-size:1.2rem;font-weight:500}
a.more{border:#c4c4c4 solid .75px;padding:5px 15px;border-radius:50px;font-size:1.4rem;color:#57c3E7;width:15vw;text-decoration:none;margin:55px auto 0;display:block;text-align:center;transition:all .5s ease}
a.more:hover{background-color:#57c3e7;color:#fff;transition:all .5s ease}
figure.longad{margin:100px 0}
a.more i{margin-left:15px}
.list-name i{cursor:pointer;color:#c4c4c4;margin-right:15px}
.list-name i.vis{color:#f7c114}
i.fa.fa-caret-right.caret{color:#a5070b;position:absolute;right:10px;top:50%;transform:translateY(-50%)}
aside.formui span i{position:absolute;right:8px;top:50%;font-size:.8rem;color:#505050;transform:translateY(-50%)}
aside.formui span i.material-icons{position:absolute;right:8px;top:50%;font-size:.8rem;color:#1e8cb5;transform:translateY(-50%)}
.formui form .row.no-gutters span:last-child{margin-right:0}
#testbox{background:url(../images/ex_bg.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:inherit}
#ecologybox{background:url(../images/ecology_bg.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:81vh}
h1.ecology-title{color:#fff;text-align:center;font-size:3rem}
h2.ecology-md-title{font-size:1.5rem;text-align:center;line-height:1.5;color:#fff;margin:25px}
.ecology-title-box{position:absolute;top:50%;left:50%;width:80%;transform:translate(-50%,-60%)}
.exbtn{height:55px!important;background-color:rgba(75,142,166,.5);border-radius:0;margin:55px 0;border:#fff solid 1px;color:#fff;padding:10px 0;display:block;font-size:1.4rem;text-decoration:none;text-align:center;transition:all .5s ease}
.exbtn.else{padding-left:0}
.exbtn:hover{border:#fff solid 1px;color:#fff;background-color:#1e8cb5;text-decoration:none;transition:all .5s ease}
h2.ex-md-title{text-align:center;color:#fff;font-size:1.3rem;font-weight:300;margin-bottom:55px}
figure.ex-img{padding:0 2.5vw}
#exbox{background:url(../images/ex_bg.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:81vh}
#exbox-2{background:url(../images/ex_bg.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:100%}
a#starttest{background-color:#1e8cb5;color:#fff;padding:5px 10px;font-size:1.8rem;bottom:10vh;text-decoration:none;border:#fff solid 1px;margin:0 auto;display:block;width:15vw;text-align:center}
#testbox i{color:#fff;font-size:5rem;display:block;width:5vw;margin:0 auto;text-align:center}
#testbox a{text-decoration:none}
#test-tips{margin:35px 0}
#test-tips p{text-align:center;margin:0;color:#666;font-size:1.2rem;padding:5px 0}
section.problembox{margin-bottom:25px}
.problembox ul{padding:0;margin:0;font-size:1.2rem;list-style-type:none}
.problembox .container{border:#ccc solid 1px}
.problembox ul li:first-child{background-color:#eee}
.problembox ul li{border-bottom:#ccc solid 1px;padding:5px 0}
.problembox ul li:last-child{border-bottom:none}
.problembox ul li .col{color:#1e8cb5}
.problembox ul li .col-md-10{color:#166988;font-weight:700;font-size:2rem}
.problembox ul li .col-md-1 span{color:#6f6f6f;font-size:2rem}
span#testtotal{font-size:4rem;color:#1e8cb5}
button.btn.btn-info.overtest{margin:0 auto 25px;display:block;cursor:pointer;background-color:#1e8cb5;box-shadow:#069 0 3px 0;border-color:transparent;font-size:1.6rem;padding:10px 65px}
nav#breadstyle2 .breadcrumb-item+.breadcrumb-item::before,nav#breadstyle2 .breadcrumb-item.active,nav#breadstyle2 a{color:#fff;content:'>'}
h5#exampleModalLongTitle{padding:0 10vw}
ul#jumpul{padding:0;margin:0;list-style-type:none}
ul#jumpul li a{color:#666;font-size:1.4rem;transition:all .5s ease}
ul#jumpul li a:hover{color:#1e8cb5;transition:all .5s ease;font-size:1.4rem}
ul#jumpul li{text-align:center}
#testbox .col-sm{text-align:center;padding:0 5vw;margin:25px 0}
ul#jumpul li i{margin-right:10px;color:#1e8cb5}
.modal-content{border:#000 solid 1px;padding:35px 35px;margin:35px 0;color:#666;font-size:1.5rem}
.jump-main{border:#000 solid 1px;padding:35px 15px;margin:35px 0;color:#666;font-size:1.8rem}
span.under-blue-line:after{width:90%;height:10px;content:'';position:absolute;background-color:#d3edfd;left:0;bottom:0;z-index:-1}
p.srt-under-line{text-align:center;width:50%;margin:0 auto 5px;font-size:1.6rem;font-weight:700;border-bottom:#333 solid 1px}
span.under-blue-line{position:relative}
.modal-body p{color:#1e8cb5;font-size:1.6rem;margin:0;font-weight:600}
.jump-title{background-color:#1e8cb5;font-size:1.4rem;text-align:center;padding:5px;border-radius:3px;margin-bottom:10px}
.jump-title a{background-color:#1e8cb5;color:#fff;text-decoration:none}
.ex-xs-title{color:#fff;text-align:center;font-size:1.5rem;padding-bottom:55px}
.ex-xl-title{color:#fff;font-size:3rem;margin-left:0;border-bottom:#fff solid 4px;position:relative}
.ex-xl-title:after{content:'';background-color:#d41619;height:4px;width:16%;position:absolute;bottom:-4px;left:0}
#picture-step-box .nav-tabs li a{border-radius:150px;width:150px;height:150px;text-align:center;margin:0 auto;align-self:center;position:relative;padding:45px 0 0 0;border:1px solid #1e8cb5;color:#0068af}
#picture-step-box .nav-tabs li a.active{background-color:#1e8cb5;color:#fff}
#picture-step-box .nav-tabs li:last-child a{background-color:#deeefb;color:#0068af;cursor:default}
#picture-step-box .nav-tabs li:last-child a.active:after,#picture-step-box .nav-tabs li:last-child a.active:before{display:none}
#picture-step-box .nav-tabs li i{position:absolute;font-size:4rem;top:50%;color:#1e8cb5;transform:translateY(-50%);right:-10px}
div#step1,div#step3,div#step4{border:#1e8cb5 solid 1px;padding:0;margin-top:8px;background-color:#fff}
div#step2{border:#1e8cb5 solid 1px;padding:0;margin-top:8px;background-color:#fff}
#picture-step-box .nav-tabs li a p{margin:0}
#picture-step-box .nav-tabs{border:none}
.col-md.ture:before{content:'';background-color:#0068af;width:15px;height:30px;position:absolute;left:-10px;top:-4px}
.col-md.false:before{content:'';background-color:#b0b0b0;width:15px;height:30px;position:absolute;left:-10px;top:-4px}
figure.igbox{margin:25px 0;transition:all .5s ease;transform:scale(1)}
figure.igbox:hover{transition:all .5s ease;transform:scale(1.2)}
span.step-title{color:#1a1a1a;font-size:1.8rem;font-weight:700;margin:35px 0;display:block;border-bottom:#000 solid 1px;padding-bottom:5px}
span.step-title span{background-color:#0068af;display:inline-block;width:10px;height:20px;margin-right:5px}
.step1box{margin-bottom:15px}
.step2box{margin-bottom:0}
.step-title2{background-color:#deeefb;text-align:center;padding:50px;font-size:1.4rem;margin-bottom:15px}
figure#step2-img{text-align:center}
.row.clipbox p{margin:0;font-size:1.4rem;text-align:center;font-weight:100}
svg.circliful{width:80%}
.chart{padding:0 80px}
span.self{color:#2d71d3;background-color:#fff;font-weight:500;border:#2d71d3 1px solid;padding:0 3px!important;margin:0 3px!important}
.sm-footer{text-align:center;margin-top:15px;color:#999}
.row.clipbox{margin-bottom:15px}
.step-title3{background-color:#deeefb;padding:25px;font-size:2rem;text-align:center}
span.counter{font-size:8rem;display:block;text-align:center;color:#2d71d3}
span.counter:after{content:"%";font-size:4rem}
div#StepContent{padding:25px 0 0 0}
.step3box{background-color:#deeefb;font-size:2rem;text-align:center;padding:15px 0;margin-left:0;margin-right:0;margin-top:40px;color:#333;position:relative;margin-bottom:15px}
.step3box:before{content:'';width:0;height:0;border-style:solid;border-width:0 50px 50px 50px;border-color:transparent transparent #deeefb transparent;position:absolute;left:50%;transform:translateX(-50%);top:-40px}
.ready{background-color:#0068af;display:block;width:23%;text-align:center;color:#fff;letter-spacing:3px;padding:10px 0;position:relative;font-weight:700;font-size:2.5rem;margin:35px auto 35px}
.ready:before{content:'';width:0;height:0;border-style:solid;border-width:20px 25px 0 25px;border-color:#0068af transparent transparent transparent;position:absolute;left:50%;transform:translateX(-50%);bottom:-20px}
div#item-list-box{background-color:#fff;border:#2086c6 solid 1px;margin:0;position:relative}
#item-list-box i{position:absolute;color:#8eccea;font-size:5rem;top:50%;left:50%;transform:translate(-190%,-50%);z-index:2}
p.space{text-align:center;font-size:2rem;margin-top:50px}
.item-right ul{padding:0;margin:0;list-style-type:none;display:flex;flex-flow:wrap}
.item-right ul li{width:50%;padding:0 50px;margin-bottom:15px}
.item-left,.item-right{text-align:center;align-self:center;margin-bottom:15px}
.item-left p{margin:0}
.step-bg p{font-size:1.6rem;margin:0;color:#4d4d4d;margin-bottom:90px}
.step-bg.row .col-6:nth-child(1){padding-left:50px}
.step-bg p:last-child{font-size:1.8rem;margin:0;color:#333}
.item-right p{margin:0;text-align:left}
.item-left p:nth-child(3),.item-right p:nth-child(3){color:#0066bf}
.item-left p:nth-child(2),.item-right p:nth-child(2){font-size:1.5rem;font-weight:700;color:#4d4d4d}
.item-left:after{content:'';border-right:#000 dashed 1px;position:absolute;height:142%;top:-19%;right:0}
.step-bg-title{color:#0066bf;font-size:3rem;font-weight:800}
.step-bg.row.no-gutter{background-color:#8eccea}
.step-bg.row{background-color:#deeefb;padding:15px 0}
i.material-icons.rotate{font-size:12rem;transform:rotate(90deg);color:#deeefb;margin-top:-35px}
.step3-title{border:#0066bf solid 1px;background-color:#fff;display:inline-block;padding:5px 15px;color:#4d4d4d;font-size:1.25rem}
.step3-title p{margin:0}
#videobox{margin-bottom:15px;padding:0 5vw}
a.startvideo{cursor:pointer}
p.counter-p{font-size:1.25rem;margin:0;padding-left:50px}
span.name{color:#333;padding:0 5px;display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;font-weight:600}
.col-6.timer{text-align:right}
figure.news-img{position:relative;margin-top:35px}
h3.qa-title{color:#1e8cb5;text-align:center;display:block;border-bottom:#1e8cb5 2px solid;padding-bottom:10px;margin:45px auto;width:18%}
ul.qa-ul{margin:0;color:grey;padding:0;list-style-type:none;font-size:1.5rem;font-weight:300}
ul.qa-ul span{color:#1e8cb5;font-size:2rem;font-weight:600}
ul.qa-ul img{transform:translateY(-3px);margin-right:5px}
.row.qa-box1,.row.qa-box2,.row.qa-box3{min-height:200px;background-color:#eef5fc;overflow:hidden}
.row.qa-box1 div:first-child{background-color:#8fd6f8;text-align:center;color:#fff;font-size:4rem;padding:9vh 0}
.row.qa-box2 div:first-child{background-color:#69c8f5;text-align:center;color:#fff;font-size:4rem;padding:9vh 0}
.row.qa-box3 div:first-child{background-color:#1eacf0;text-align:center;color:#fff;font-size:4rem;padding:9vh 0}
.row.qa-box1 div:nth-child(2),.row.qa-box2 div:nth-child(2),.row.qa-box3 div:nth-child(2){background-color:#eef5fc}
.row.qa-box1 div:nth-child(3),.row.qa-box2 div:nth-child(3),.row.qa-box3 div:nth-child(3){background-color:#eef5fc}
a.qa-more{padding:5px 15px;border-radius:5px;font-size:1.2rem;color:#83c8e9;width:15vw;margin:0 15px;text-decoration:none;display:block;text-align:center;border:#83c8e9 solid 2px}
ul.navul{margin:0;padding:15px;list-style-type:none;border:#efefef solid 1px}
ul.navul li span{background-color:#8fd6f8;color:#fff;padding:0 6px;margin-right:5px}
ul.navul li{margin-bottom:5px}
ul.navul li a{text-decoration:none;color:#666}
.newstitle{background-color:#efefef}
.newstitle{background-color:#efefef;font-size:1.5rem;color:#666;padding:10px 0 10px 40px;position:relative}
.newstitle:before{content:'';background-color:#8fd6f8;position:absolute;left:0;height:100%;width:8px;top:0}
.row.newsbox{padding:15px 0}
.newstitle.mastertitle{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;padding-left:15px}
.newsmain{color:#666;font-size:1.1rem;line-height:160%}
.crtated{margin:5px 0}
aside.newsblock{margin-top:35px}
aside.newsblock .nav-tabs .nav-link i{font-size:1.6rem;position:absolute;right:15px;top:50%;transform:translateY(-50%)}
aside.newsblock .nav-tabs .nav-link{font-size:1.4rem;color:#666;background-color:#f2f2f2;border-right:#ccc solid 1px;border-top:#ccc solid 1px;position:relative;border-bottom:#ccc solid 1px}
aside.newsblock .nav-tabs .nav-link span{display:block;font-size:.4rem;margin:0}
a.nav-item.nav-link.active i{color:#8fd6f8}
a.nav-item.nav-link.active{border-top:#1e8cb5 solid 10px;border-bottom:none;background-color:#fff}
h5.mb-0 a i{position:absolute;right:15px;top:50%;transform:translateY(-50%);color:#1e8cb5;font-size:2rem}
.card-header{position:relative}
h5.mb-0 a{display:block;text-decoration:none;color:#666;line-height:150%;padding-left:1.25rem;font-size:1.15rem}
h5.mb-0 a:before{content:'Ｑ';color:#70c2e5;position:absolute;left:10px}
.all-qa-title{margin:20px 0;padding-left:35px;border-left:#666 solid 3px}
#all-qa-block .card-body:before{content:'Ａ';color:red;font-size:1.4rem;position:absolute;left:10px}
#all-qa-block .card-body{padding:1.25rem 1.25rem 1.25rem 2.6rem}
aside#all-qa-block{margin-top:35px}
p.lgorang.fb{color:#3b5998;font-size:2rem;font-weight:700}
div#colletresult{justify-content:center}
.addres a{color:#666;font-weight:350}
.newbox{padding:0 15px!important;margin-bottom:25px}
#newslistbox{padding:35px;margin-top:35px;border:#ccc solid 1px}
.newslistbox ul{padding:0;margin:0;list-style-type:none}
.news-wrap{border:#ccc solid 1px;padding:25px;background-color:#eff8fc;margin-top:25px}
.newslistbox section{display:none}
.newslistbox section.active{display:block}
.newslistbox .tab-nav li a{margin-top:0;height:inherit;width:inherit;position:relative;border-radius:0;background:#f2f2f2;line-height:inherit;padding:9px 0 0 10px;text-decoration:none;color:#666;font-size:1.2rem;text-align:left;border-top:#ccc solid 1px;border-left:#ccc solid 1px;border-bottom:#ccc solid 1px;border-right:none;transition:background .2s ease,line-height .2s ease,margin .2s ease}
.newslistbox .tab-nav li a span{font-size:.5em;color:#c9c9c9}
.newslistbox .tab-nav li.active a{margin-top:0;border-top:#1e8cb5 solid 10px;border-left:#ccc solid 1px;border-bottom:none;border-right:none;background-color:#fff;height:inherit;width:inherit;position:relative;border-radius:0;line-height:inherit;padding:0 0 0 10px;font-weight:700;color:#666;text-align:left;text-decoration:none;transition:background .2s ease,line-height .2s ease,margin .2s ease}
.newslistbox .tab-nav li:last-child a{cursor:pointer}
.newslistbox .tab-nav li.active:last-child a{margin-top:0;border-top:#1e8cb5 solid 10px;border-left:#ccc solid 1px;border-bottom:none;border-right:#ccc solid 1px;background-color:#fff;cursor:pointer;height:inherit;width:inherit;position:relative;border-radius:0;line-height:inherit;padding:0 0 0 10px;text-align:left;text-decoration:none;color:#666;transition:background .2s ease,line-height .2s ease,margin .2s ease}
.newslistbox .tab-nav li:last-child a{margin-top:0;height:inherit;width:inherit;position:relative;border-radius:0;background:#f2f2f2;line-height:inherit;padding:9px 0 0 10px;text-decoration:none;color:#666;font-size:1.2rem;text-align:left;border-top:#ccc solid 1px;border-left:#ccc solid 1px;border-bottom:#ccc solid 1px;border-right:#ccc solid 1px;transition:background .2s ease,line-height .2s ease,margin .2s ease}
.newslistbox .tab-nav{height:80px;display:flex}
.newslistbox .tab-nav li a i{color:#666;font-size:1.4rem;position:absolute;top:50%;right:15px;transform:translateY(-50%)}
.newslistbox .tab-nav li.active a i{color:#1e8cb5}
.newslistbox .tab-nav li.active a:after,.newslistbox .tab-nav li.active a:before,.newslistbox .tab-nav li:first-child:after,.newslistbox .tab-nav li:nth-child(2):after,.newslistbox .tab-nav li:nth-child(3):after{display:none}
p.author-name,p.author-title{margin:0;padding-left:15px}
figcaption.authormsg.row.no-gutters{background-color:#eee;padding:10px}
.row.news-insidebox{margin-top:35px}
figure.authorimg{background-color:#eee;padding:10px}
.news-main{font-size:1.25rem;color:#666;margin-top:15px}
h3#ecology-sm-title{color:#0068af;text-align:center;position:relative;margin:35px 0}
h3#ecology-sm-title:after{content:'';background-color:#0068af;width:20%;height:2px;position:absolute;bottom:-8px;transform:translateX(-50%);left:50%}
.talkbox{background-color:#0ca5e6;border-radius:5px;padding:25px;color:#fff;position:relative;font-size:1.35rem;padding-left:35px}
.talkbox a{color:#0ca5e6}
.talkbox:before{content:'';width:0;height:0;border-style:solid;border-width:10px 30px 10px 0;border-color:transparent #0ca5e6 transparent transparent;left:-25px;position:absolute}
.row.ans,.row.que{margin-bottom:25px}
.row.ans .talkbox{background-color:#eceeef;color:#4d4d4d}
.row.ans .talkbox:before{border-color:transparent #eceeef transparent transparent}
span.pr-job-title{display:block;text-align:center;color:#0ca5e6;font-size:1.15rem;margin-top:5px}
#hurry-qa-box{background-color:#eceeef;padding:35px 0}
.row.hurry-a{padding-left:60px;color:#0068af;font-size:1.45rem}
.row.hurry-q{color:#4d4d4d;font-size:1.2rem}
ul#hurry-qa-list{padding:0;margin:0;list-style-type:none}
ul#hurry-qa-list li{margin:55px 0}
ul#hurry-qa-list li i{transform:translateY(5px)}
ul#hurry-qa-list li p{margin:0;font-size:1.25rem}
h4#hurry-qa-title{margin-bottom:35px;text-align:center;color:#0068af;font-size:1.75rem}
.row.hurry-q .col-11.align-self-center{margin-bottom:10px}
ul#hurry-qa-list li a{color:#0ca5e6;font-size:1.1rem;text-decoration:underline}
div#animated-pp{margin-top:25px}
g#p11,g#pp1,g#pp10,g#pp2,g#pp3,g#pp4,g#pp5,g#pp6,g#pp7,g#pp8,g#pp9{ opacity: 0; }
g#pp1{animation:vis 1s infinite ;animation-delay:0s;}
g#pp2{animation:vis 1s infinite ;animation-delay:0.5s}
g#pp3{animation:vis 1s infinite ;animation-delay:1s}
g#pp4{animation:vis 1s infinite ;animation-delay:1.5s}
g#pp5{animation:vis 1s infinite ;animation-delay:2s}
g#pp6{animation:vis 1s infinite ;animation-delay:2.5s}
g#pp7{animation:vis 1s infinite ;animation-delay:3s}
g#pp8{animation:vis 1s infinite ;animation-delay:3.5s}
g#pp9{animation:vis 1s infinite ;animation-delay:4s}
g#pp10{animation:vis 1s infinite ;animation-delay:4.5s}
g#p11{animation:vis 1s infinite ;animation-delay:5s}
@-webkit-keyframes vis{
 
    100% {      
    visibility: visible;
      
    }
    
    
 
}
@-moz-keyframes vis{
    
     50% {
          visibility:visible;
    }
    
    100% {
           visibility: hidden;
       
    }
    
}
@-webkit-keyframes vis2{
    
  
    
    100% {
           opacity: 1;;
       
    }
    
    
 
}
@-moz-keyframes vis2{
    
   
    
    100% {
         opacity: 1;
       
    }
    
}

figure#letter:before{content:'請點選信封！';transform:translate(120px,50px);position:absolute;width:100%}
.row.wowimg.no-gutters figure:nth-child(1),.row.wowimg.no-gutters figure:nth-child(2),.row.wowimg.no-gutters figure:nth-child(3){opacity:0}
.row.wowimg.no-gutters figure:nth-child(4){opacity:1}
.row.wowimg.no-gutters figure:nth-child(1){animation:vis2 5s infinite;animation-delay:-1s}
.row.wowimg.no-gutters figure:nth-child(2){animation:vis2 5s infinite;animation-delay:-.2s}
.row.wowimg.no-gutters figure:nth-child(3){animation:vis2 5s infinite;animation-delay:.6s}
#picture-step-box ul#bottom-myTab li a.active:before{bottom:initial!important;top:-3.5vh!important}
#picture-step-box ul#bottom-myTab li a.active:after{bottom:inherit!important;top:-3vh!important}
ul#bottom-myTab{margin-top:25px}
.slick-next:before,.slick-prev:before{color:#000}
div#slider-pic{width:100%;background-color:#fff;padding-top:4.8vh;height:100%}
.slick-prev{left:5px;z-index:1}
.slick-next{right:-10px}
.tab-group{position:relative;border:1px solid #0068af;margin-top:210px;border-radius:0}
.tab-group section{opacity:0;height:0;padding:0 2em;overflow:hidden;transition:opacity .4s ease,height .4s ease}
.tab-group section.active{opacity:1;height:auto;overflow:visible}
.tab-nav{list-style:none;margin:-180px -1px 0 0;padding:0;height:180px;display:flex}
.tab-nav li{flex:25%;position:relative}
.tab-nav li a{top:0;margin-top:0;height:150px;width:150px;font-size:1.2rem;position:relative;display:block;margin:0 auto;border-radius:150px;background:#fff;line-height:2em;border:#0068af solid 1px;padding:0;text-decoration:none;color:#0068af;margin-top:0;text-align:center;padding-top:3vh;margin-right:auto;transition:background .2s ease,line-height .2s ease,margin .2s ease}
.tab-nav li.active a{background:#0068af;color:#fff;margin:0 auto;margin-top:0;height:150px;border-radius:150px;width:150px;text-align:center;padding-top:3vh}
.tab-nav li.active a:before{width:10px;height:10px;background-color:#1e8cb5;position:absolute;content:'';bottom:-3.5vh;border-radius:100px;left:50%;transform:translateX(-50%)}
.tab-nav li.active a:after{content:'';z-index:-1;background-color:#1e8cb5;width:1px;height:50px;left:50%;position:absolute;transform:translateX(-50%);bottom:-3vh}
.tab-nav li:last-child a{background-color:#deeefb}
.tab-nav li:last-child.active a{color:#0068af}
.tab-nav li:first-child:after,.tab-nav li:nth-child(2):after,.tab-nav li:nth-child(3):after{content:'＞';position:absolute;top:50%;right:-10px;transform:translateY(-50%);font-size:2rem;color:#0068af}
.item-left.col-md-5:before{content:'道具清單';border:#000 solid 1px;position:absolute;top:-136px;left:100px;color:#4d4d4d;font-weight:700;background-color:#fff;padding:5px 20px;font-size:1.3rem}
i.fa.fa-chevron-down{color:#8eccea;font-size:6rem;display:block;text-align:center;transform:translateY(-40px)}
ul.nav.nav-tabs.bottomnav li a{background:#fff;border:#0068af 1px solid;color:#0068af;margin:0 auto;margin-top:auto;height:150px;font-size:1.2rem;border-radius:150px;width:150px;text-align:center;padding-top:3vh}
ul.nav.nav-tabs.bottomnav li:last-child a{cursor:default;background-color:#deeefb}
ul.nav.nav-tabs.bottomnav li:first-child:after,ul.nav.nav-tabs.bottomnav li:nth-child(2):after,ul.nav.nav-tabs.bottomnav li:nth-child(3):after{content:'＞';position:absolute;top:50%;right:-10px;transform:translateY(-50%);font-size:2rem;color:#0068af}
ul.nav.nav-tabs.bottomnav{margin-top:25px;border-bottom:none;margin-bottom:35px}
nav#pagestyle{width:100%}
nav#pagestyle .page-link{color:#bfe4f3;font-size:.4rem;background-color:transparent;border:none}
nav#pagestyle li:first-child .page-link,nav#pagestyle li:last-child .page-link{color:#000;font-size:.4rem;background-color:transparent;border:none}
nav#pagestyle .page-item.active .page-link{background-color:transparent;color:#46798f}
.sm-newstitle{margin-top:5px}
#great a.nav-item.nav-link{padding:5px 50px;flex:inherit}
.great-insdie-tab h5.mb-0 a:before{display:none}
.great-insdie-tab .card-header{padding:0}
.great-insdie-tab h5.mb-0 a{display:block;text-decoration:none;color:#666;line-height:150%;margin-top:10px;padding-left:0;background-color:#fff;font-size:1.15rem;border:#1e8cb5 solid 1px}
span.great-step-title{background-color:#1e8cb5;color:#fff;text-align:center;padding:5px 0;display:block}
.col.align-self-center.great-step-title2{padding-left:1.2em;font-size:1.6rem}
.great-insdie-tab .card{border:none;border-radius:0}
.great-insdie-tab .card-body{padding:0}
h3.great-title{position:relative;margin:35px 35px 35px 25px}
h3.great-title:before{background:#1e8cb5;width:10px;height:100%;left:-25px;content:'';position:absolute}
section#edit-myself{background-color:#eceeef;padding:100px 0;position:relative;margin-top:45px}
section#edit-myself:before{width:0;height:0;content:'';border-style:solid;border-width:50px 30px 0 30px;border-color:#fff transparent transparent transparent;position:absolute;top:0;left:50%;transform:translateX(-50%)}
a.edit-lg{background-color:#1e8cb5;color:#fff;font-size:2rem;padding:5px 15px;transition:all .5s ease;border-radius:5px;text-decoration:none}
a.edit-lg:hover{background-color:#5ba9c6;transition:all .5s ease;text-decoration:none}
#edit-myself .row{margin-top:10px}
#edit-myself .row:last-child a{font-size:1.6rem;color:#666;margin:0 15px}
#edit-myself .row:last-child a:hover{color:#1e8cb5}
#edit-myself .row:last-child a i{color:#1e8cb5}
.col-1.align-self-center.i-icon{color:#1e8cb5;font-size:2rem}
#greatbox{background:url(../images/great_bg.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:50vh}
#greatbox-blue{background:url(../images/great_bg_blue.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;position:relative;height:81vh}
.blackstyle{color:#000!important}
.select-example-box a{font-size:1.4rem;border:#1e8cb5 solid 1px;color:#1e8cb5;padding:10px 40px;display:inline-block;margin-bottom:10px;text-decoration:none;transition:all .5s ease;font-weight:700}
.select-example-box a:hover{border:#1e8cb5 solid 1px;color:#fff;padding:10px 40px;text-decoration:none;background-color:#1e8cb5;display:inline-block;margin-bottom:10px;background-color:#1e8cb5;transition:all .5s ease}
.selectbox{text-align:center}
.slect-example-title{font-size:2rem;text-align:center;margin-top:50px;color:#1e8cb5;font-weight:700;position:relative}
.slect-example-title:after{content:'';height:2px;background-color:#1e8cb5;width:17%;position:absolute;left:50%;transform:translateX(-50%);bottom:0}
.more-newsbox{border-top:#ccc solid 1px;padding-top:15px}
.more-news-title{margin-bottom:15px;padding-left:35px;position:relative;color:#666;font-size:1.3rem}
.more-news-title:before{width:3px;height:100%;content:'';background-color:#666;position:absolute;left:0}
ul.personal{padding:0;margin:0;list-style-type:none}
ul.personal{padding:0;margin:0;list-style-type:none;position:relative}
ul.personal li{border-bottom:#ccc solid 1px;padding:5px 0;font-size:1.2rem}
.perpic{position:absolute;right:0;border:#ccc solid 1px;top:5px}
.qa_content h4{margin-top:15px}
ul.listul{margin:0;padding-top:10px;padding-bottom:10px;padding-right:10px}
ul.listul-2{margin:0;padding:0;list-style-type:none}
.center-img{text-align:center}
.pinky{background-color:#fff3f7;padding:12px 0;margin:5px 0}
.card-body h5{margin:15px 0}
.center-img{padding:0 10px}
#fontbox{background-color:#000;width:100%;height:100%;position:fixed;top:0;transition:all .5s ease;transform:scale(0);transform-origin:center;color:#fff;transform-origin:center;text-align:center;font-size:3em}
#fontbox.opc{background-color:#000;width:100%;z-index:10;height:100%;position:fixed;top:0;transition:all 1s ease;transform:scale(1);transform-origin:center}
p.continue{font-size:1rem;margin-bottom:0}
.terminal{width:80%;font-size:26px;color:#fff;letter-spacing:2px;position:absolute;top:50%;left:50%;transform:translateX(-50%);z-index: 2;}
#masterbox{display:flex;visibility:hidden;height:inherit;background-color:rgba(0,0,0,.5)}
#text-main{align-self:center;opacity:0}
div#master{align-self:flex-end}
#se-talk span.vis{visibility:visible;transition:.5s ease}
#se-talk span{visibility:hidden;display:block;transform:translateY(-50%);left:50%;text-align:center;margin-left:-45%;position:absolute;transition:.5s ease;width:100%;font-size:2rem;cursor:pointer}
div#se-talk{position:relative}
#se-talk span i{cursor:pointer;animation:ii 1s linear infinite;-webkit-animation:ii 1s linear infinite;-moz-animation:ii 1s linear infinite;margin-left:5px}
#se-talk span i:hover{color:#ff0}
@-webkit-keyframes ii{50%{opacity:0}
100%{opacity:1}
}
@-moz-keyframes ii{50%{opacity:0}
100%{opacity:1}
}
#place1{background:url(../images/house.jpg);background-position:center;opacity:.5;height:100%;cursor:pointer;transition:.5s ease;position:absolute;width:100%}
#masterbox.style1{background-image:url(../images/house.jpg);background-position:center;background-size:cover}
#masterbox.style2{background-image:url(../images/oldhouse.jpg);background-position:center;background-size:cover}
#masterbox.style3{background-image:url(../images/underground_road.jpg);background-position:center;background-size:cover}
#place1:hover,#place2:hover,#place3:hover{opacity:1;transition:.5s ease;cursor:pointer}
#place2{background:url(../images/oldhouse.jpg);background-position:center;background-size:cover;opacity:.5;height:100%;cursor:pointer;transition:.5s ease;width:100%;position:absolute}
#place3{background:url(../images/underground_road.jpg);background-position:center;opacity:.5;height:100%;cursor:pointer;transition:.5s ease;width:100%;position:absolute}
#select-place{height:100%;visibility:hidden}
#select-place .row{height:inherit}
#select-place .row .col{padding:0}
#select-place:before{content:'最近感到迷惘嗎?選擇以下地點，尋找你心中的心靈占卜師，前往……';position:absolute;left:50%;top:10%;transform:translate(-50%,0);z-index:10;width:80%}
#place1 span p:first-child,#place2 span p:first-child,#place3 span p:first-child{font-size:10rem}
#place1 span,#place2 span,#place3 span{width:100%;padding-bottom:35px}
ul.onepice{margin-top:15px}
#masterbox .row{width:100%;background-color:rgba(0,0,0,.6);margin:0}
#letter{width:317px;height:219px;background-color:red;margin:0 auto;line-height:100px;background:url(../images/letter.png);-webkit-animation:letter 2s linear infinite;-moz-animation:letter 2s linear infinite;cursor:pointer}
@-webkit-keyframes letter{50%{transform:translateY(10px)}
100%{transform:translateY(0)}
}
@-moz-keyframes letter{50%{transform:translateY(10px)}
100%{transform:translateY(0)}
}
#letterbox{width:100%;height:100%;position:fixed;background-color:rgba(255,255,255,.8);transform:scale(0);transition:all .5s ease}
#letterbox i{font-size:2rem;background-color:rgba(0,0,0,.8);color:#fff;padding:10px 15px;right:15px;top:35px;position:absolute}
#letterbox.run{width:100%;height:100%;position:fixed;background:url(../images/letter-bacjground.jpg);background-repeat:no-repeat;background-position:left center;transform:scale(1);z-index:11;top:0;transition:1s ease;background-size:cover}
#letter-content{width:90%;position:absolute;min-height:200px;left:50%;top:50%;transform:translate(-50%,-50%)}
.master-title{font-size:2rem;color:#c0272d;text-align:center}
.master-main{font-size:2rem;font-weight:700;margin:15px 0}
.recommend{text-align:center;margin:55px 0}
.recommend a{color:#000;font-size:1.8rem;text-decoration:underline}
#bottomblock{position:absolute;bottom:5%;width:90%;left:50%;transform:translateX(-50%);list-style-type:none}
#bottomblock .col-sm-4 a{border:#4d4d4d solid 2px;width:100%;display:block;padding:20px 15px;text-align:center;color:#4d4d4d;font-size:1.4rem;text-decoration:none;transition:all .5s ease;border-radius:5px}
#bottomblock .col-sm-4 a:hover{border:#4d4d4d solid 2px;background-color:#4d4d4d;color:#fff;transition:all .5s ease;text-decoration:none}
#bottomblock .col-sm-4 a span{font-size:.8rem}
ul#pr-list{display:flex;flex-wrap:wrap}
ul#pr-list li{width:33%}
#explanation>.row{margin-right:0;margin-left:0}
ul#pr-list li span{display:block;font-size:.8rem;color:#736357;text-align:center}
div#m-explanation{background-color:#fff;top:0;position:absolute;width:95%;height:320px;left:50%;transform:translate(-50%,0);border:#000 solid 3px}
.m-exp-title{text-align:center;font-size:1.2rem;color:#4b59c0}
ul#m-pr-list{padding:0;margin:0;display:flex;flex-wrap:wrap}
ul#m-pr-list li{padding:0;width:33%}
ul#m-pr-list li span{font-size:.95rem}
.newbox a{text-decoration:none;color:#333}
.lg-title{font-size:2rem;position:relative;font-weight:700}
.lg-title:after{content:'';background-color:#ccc;height:150%;width:1px;position:absolute;right:35px;top:50%;transform:translateY(-50%)}
aside.worklist-title{margin-bottom:25px;background-color:#fff;padding:25px;border:#ccc solid 1px}
ul.totalul,ul.workmain{padding:0;margin:0;font-size:1.2rem;list-style-type:none}
ul.totalul li{display:inline-block;padding:0 10px;position:relative}
ul.totalul li:last-child:after{display:none}
ul.workmain li{margin-bottom:3px;color:#666;padding:3px 0;font-size:1.1rem}
ul.workmain li img{margin-right:5px}
span.address,span.compname{color:#000;font-weight:700;margin-left:15px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:430px;display:inline-block;transform:translateY(5px)}
ul.workmain li:first-child a{color:#218dbb;text-decoration:underline;font-size:1.4rem}
ul.workmain li:first-child i{cursor:pointer;color:#57c3e7}
ul.workmain li:nth-child(2){border-bottom:#ccc solid 1px}
ul.workmain li:nth-child(3){border-bottom:#ccc solid 1px}
ul.totalul li a{color:#333}
span.money{margin-left:20px;background-color:#ff7429;color:#fff;padding:0 15px;border-radius:15px}
ul.totalul li:after{height:28px;width:1px;content:'';background-color:#333;position:absolute;right:0;top:50%;transform:translateY(-50%)}
button#dropdownMenuButton{background-color:transparent;border:none;color:#000;font-size:1.2rem;padding:0;transform:translateY(-2px)}
.worklistbox div:first-child a{display:inline-block;border:#2b93b9 solid 1px;color:#2b93b9;padding:2px 35px;font-size:1.4rem;transition:all .5s ease;text-decoration:none}
.worklistbox div:first-child a:hover{color:#fff;transition:all .5s ease;background-color:#2b93b9;text-decoration:none}
.worklistbox div i{margin-right:5px;font-size:1.4rem}
.worklistbox div:first-child p{margin:10px 0 0 0}
.worklistbox div:first-child{text-align:center;padding-right:35px;position:relative}
.consort:after{display:none}
.worklistbox div:first-child:after{content:'';height:200%;width:1px;position:absolute;background-color:#ccc;right:35px;top:50%;transform:translateY(-50%)}
.worklistbox div:last-child{text-align:center;align-self:center}
.row.worklistbox{background-color:#fff;padding:15px;border:#ccc solid 1px;margin-top:15px}
.consort{display:inline-block;border:#ccc solid 1px;padding:10px 25px;border-radius:50px;font-size:1.2rem;color:#ff7328}
.consort span{margin-left:20px}
p.describe{margin-top:5px}
.col-md.tipbtn{cursor:pointer;position:relative}
.col-md.tipbtn span{background-color:rgba(0,0,0,.8);color:#fff;padding:5px;position:absolute;bottom:-35px;display:none;width:75%;left:-5px}
i.ques{position:absolute;top:-30px;right:0;color:#ccc;cursor:pointer}
.ques-text{display:none;position:absolute;background-color:rgba(0,0,0,.8);color:#fff;padding:5px;top:-40px;width:85%;right:35px}
.consort.down{color:#969696}
ul.workmain li:first-child i.vis{cursor:pointer;color:#fc9b00}
span.condition{border-radius:5px;border:#ccc solid 1px;font-size:.8rem;padding:3px 5px;color:#666;display:inline-block;margin:0}
#floatmenu img{margin:0 auto}
.list-page{margin-top:25px}
.list-page .page-link{color:#333}
.page-item.active .page-link{background-color:#4d4d4d;border-color:#4d4d4d}
span.amount-tip{background-color:#1e8cb5;color:#fff;padding:2px 10px}
div#amountbox{border:#ccc solid 1px;color:#666;margin:5vw 0}
div#amountbox .row div:last-child{text-align:center;font-size:1.2rem}
div#amountbox-inside{border:#ccc solid 1px;color:#666;margin:5vw 0;background-color:#eef5fc;padding:15px}
div#amountbox-inside2{border:#ccc solid 1px;color:#666;margin:2vw 0;background-color:#eef5fc;padding:15px}
div#amountbox-inside2 p{margin:0}
div#amountbox-inside p{margin:0}
#login-before-btn{background-color:#1e8cb5;color:#fff;border-radius:5px;text-decoration:none;display:inline-block;padding:10px 20px;font-size:1rem;box-shadow:0 5px #186a89}
#login-after-btn{background-color:#b0b0b0;color:#fff;border-radius:5px;text-decoration:none;display:inline-block;padding:10px 20px;font-size:1rem;box-shadow:0 5px #969696}
span.amount{margin:0 5px}
.xl-title{font-size:2.2rem;font-weight:700;text-align:center}
a.amount-a{border:#1e8cb5 solid 5px;display:block;text-align:center;color:#1e8cb5;font-size:2rem;text-decoration:none;padding:15px 0;transition:all .5s ease}
a.amount-a:hover{background-color:#1e8cb5;color:#fff;transition:all .5s ease;text-decoration:none}
a.amount-a i.fa.fa-chevron-down{font-size:1.6rem;color:#1e8cb5;transform:translateY(0)}
a.amount-a:hover i.fa.fa-chevron-down{color:#fff}
.row.three-select{margin:45px 0 0 0}
a#join span{background-color:#ff7429}
a#join span{background-color:#ff7429;position:absolute;top:20px;padding:0 8px;right:20px;border-radius:30px}
#worklist ul{padding:15px;position:relative;border-radius:5px;margin:0;border:#ccc solid 1px;list-style-type:none;background-color:#fff}
#worklist ul i{position:absolute;right:15px;top:15px;color:#999;font-size:1.4rem;cursor:pointer}
#worklist ul li img{margin-right:10px}
#worklist ul li:first-child{color:#1e8cb5;text-align:center;margin-bottom:25px;font-size:1.4rem;padding-right:25px}
#worklist ul li:nth-child(2){padding:5px 0;border-bottom:#ccc solid 1px;text-overflow:ellipsis;font-size:1.25rem;overflow:hidden;white-space:nowrap}
#worklist ul li:nth-child(3){padding:5px 0;border-bottom:#ccc solid 1px;font-size:1.25rem}
#worklist ul li:nth-child(4){padding:5px 0;border-bottom:#ccc solid 1px;font-size:1.25rem}
#worklist ul li:nth-child(5){padding:5px 0;border-bottom:#ccc solid 1px;font-size:1.25rem}
#worklist ul li:nth-child(6){padding:5px 0;border-bottom:#ccc solid 1px;font-size:1.25rem}
#worklist ul li:nth-child(6) span{background-color:#ff7329;color:#fff;padding:0 12px;border-radius:20px;margin-left:10px}
#worklist ul a{background-color:#1e8cb5;color:#fff;border-radius:5px;text-decoration:none;display:block;padding:5px 20px;font-size:1.2rem;box-shadow:0 5px #186a89;width:35%;text-align:center;margin:15px auto 5px}
#worklist .row div{margin-bottom:15px;position:relative}
.row.result div:first-child span{font-size:2rem;padding-left:15px}
.row.result div:first-child span:before{content:'';background-color:#0068af;width:10px;height:30px;position:absolute;top:10px;left:15px}
span.blue-border{border:#216aaf solid 1px;color:#216aaf;padding:5px 15px;display:inline-block;font-size:1.2rem;font-weight:700}
.row.result{margin-top:65px;padding-bottom:15px;border-bottom:#ccc solid 2px;margin-bottom:65px}
.result-list-title{border:#216aaf solid 1px;color:#216aaf;padding:5px 10px;display:inline-block;font-size:1.2rem;font-weight:700}
.result-list-main{font-size:1.1rem;margin-bottom:15px}
#result-a{background-color:#0068af;color:#fff;display:block;font-size:2rem;text-decoration:none;text-align:center;width:70%;margin:25px auto 0;padding:15px 0}
a.result-else-a{color:#666;font-size:1.6rem;margin:10px 15px}
a.result-else-a:hover{color:#57c3e7}
a.result-else-a i{margin-right:10px;color:#0068af}
.result-list-main i{color:#63c3e7;margin-right:5px}
.result-list-main p a{color:#57c3e7}
.newsbox a{color:#666}
.sharebox span{display:inline-block;margin:0 5px}
.sharebox span:nth-child(2){transform:translateY(5px)}
.slider-img{position:absolute;width:100%;transform:scale(.9);transition:all .5s ease;cursor:pointer}
.slider-img:hover{transform:scale(1.1);transition:all .5s ease}
.slick-slide span{position:relative}
#test-circle,#test-circle2{transition:all .5s ease;text-align:center}
form#pr1,form#pr10,form#pr11,form#pr12,form#pr13,form#pr14,form#pr15,form#pr16,form#pr17,form#pr18,form#pr19,form#pr2,form#pr20,form#pr3,form#pr4,form#pr5,form#pr6,form#pr7,form#pr8,form#pr9{display:flex}
.conditionlist{margin:5px 0;display:block}
.conditionlist span{margin:0 2px}
.startgreat i{color:#fff;font-size:5rem;position:absolute;bottom:15px;left:50%;transform:translateX(-50%)}
a.else-exam{border:#fff solid 1px;color:#fff;width:50%;display:block;font-size:1.6rem;margin:0 auto 40px;text-align:center;transition:all .5s ease;text-decoration:none;padding:15px 0}
a.else-exam:hover{color:#166b86;transition:all .5s ease;background-color:#fff;text-decoration:none}
#select-edit .modal-content{padding:0}
.line{margin:55px 0 100px 0}
.step1box .row.no-gutters{position:relative}
.step1box .row.no-gutters .col-md-3{position:absolute;bottom:0;right:0}
.collectstyle{width:300px!important;transform:translate(-60px,45px)!important}
a.exp-icon {font-size: 0.5rem !important;border: #218dbb solid 1px;padding: 0 5px;text-decoration: none !important;margin-left: 15px;}
a.exp-icon:hover {background: #218dbb;transition: all 0.5s ease;color: #fff !important;}
/* nav*/
.sidenav{background:#212121;box-shadow:2px 2px 6px rgba(0,0,0,.3);display:block;font-size:16px;font-weight:400;height:100%;left:0;position:fixed;overflow:auto;transform:translate(-262px,0);transition:transform .3s;top:0;width:256px;z-index:100}.sidenav.show{transform:translate(0,0)}.sidenav-brand{background:#ff7329;border-bottom:1px solid #ff7329;color:#FAFAFA;font-size:24px;font-weight:700;line-height:32px;padding:20px 24px 19px}.sidenav-dropdown,.sidenav-header{border-bottom:1px solid #424242;margin:0}.sidenav-header{background:0 0;color:#757575;font-size:19.2px;line-height:32px;padding:16px 24px 15px}.sidenav-header small{display:block;font-size:14.4px;line-height:16px}.sidenav-menu{list-style:none;margin:0;padding:0}.sidenav-menu li{display:block;position:relative}.sidenav-menu a{background:0 0;color:#BDBDBD;display:block;line-height:24px;padding:16px 32px;text-decoration:none}.sidenav-menu a:hover{background:#616161}.sidenav-menu a.active,.sidenav-menu a.active .sidenav-dropdown-icon,.sidenav-menu a.active .sidenav-link-icon{color:#FAFAFA}.sidenav-dropdown-icon,.sidenav-link-icon{color:#757575;position:absolute;text-align:center;top:16px}.sidenav-link-icon{display:block;height:24px;left:24px;width:24px}.sidenav-link-title{display:block;padding:0 16px 0 40px}.sidenav-dropdown{display:none;list-style:none;padding:0}.sidenav-dropdown a{background:#191919;padding-left:72px}.sidenav-dropdown a:hover{background:#616161}.sidenav-dropdown li:first-child a{box-shadow:inset 0 1px 1px rgba(0,0,0,.1)}.sidenav-dropdown-icon{display:none;height:16px;right:16px;width:16px}.sidenav-dropdown-icon.show{display:block}.sidenav-overlay{background:rgba(255,255,255,.8);display:none;height:100%;left:0;position:fixed;top:0;width:100%;z-index:99}.sidenav-no-scroll{overflow:hidden!important}
/*nav-over*/
@media (min-width:1441px){.ngbox2{padding:7vw 0}
div#slider-pic{width:100%;background-color:#fff;padding-top:7vh;height:100%}
#testbox{height:81vh}
svg#linetitle{width:40%}
nav#nav>ul>li>a:before{background-color:#ad070b;content:'';width:0;height:5px;bottom:-23px;z-index:10;display:block;position:absolute;left:10%;transition:all .5s ease}
nav#nav>ul>li>a:hover:before{background-color:#ad070b;content:'';width:50%;height:5px;bottom:-23px;z-index:10;display:block;position:absolute;left:10%;transition:all .5s ease}
nav#nav>ul>li>a:after{background-color:#ad070b;content:'';width:0;height:5px;bottom:-23px;z-index:10;display:block;position:absolute;right:10%;transition:all .5s ease}
nav#nav>ul>li>a:hover:after{background-color:#ad070b;content:'';width:50%;height:5px;bottom:-23px;z-index:10;display:block;position:absolute;right:10%;transition:all .5s ease}
}
@media (min-width:992px) and (max-width:1199px){aside#searchui{width:90vw}
a.nextbtn{width:30vw}
span.col-lg.col-sm-12:last-child input{padding:.5rem 1rem .5rem 8px}
a#starttest{width:30vw}
#item-list-box i{top:50%;left:50%;transform:translate(-160%,-50%);z-index:2}
.item-left:after{content:'';border-right:#000 dashed 1px;position:absolute;height:130%;top:-13%;right:0}
aside.newsblock nav.nav.nav-tabs{padding-left:0}
}
@media (min-width:768px) and (max-width:991px){aside#searchui{width:90vw}
div#amountbox .row div:last-child{font-size:1rem}
div#amountbox{margin:5vw 0}
nav#lgnav ul>li a{font-size:1.2rem}
a.more{width:25vw}
a#starttest{width:30vw}
p.card-text{margin-top:15px;font-size:1.1rem}
p.card-text i{margin-left:5px;font-size:2rem;transform:translateY(4px) rotate(90deg);transition:all .5s ease;display:block;margin:0 auto}
a#start-one-point{font-size:1rem;box-shadow:0 3px #c63}
p.lgorang{font-size:1.6rem}
p.lggray{font-size:1.1rem}
.exbtn,aside.newsblock .nav-tabs .nav-link,p.lgorang.fb{font-size:1.2rem}
a#start-one-point-fb,h4.card-title,input.form-control.form-control-lg{font-size:1rem}
.row.no-gutters.one-point>aside>i{right:-15px;font-size:3.5rem}
a.nextbtn{width:30vw}
span.col-lg.col-sm-12{margin-bottom:10px}
.item-right ul li{width:50%;padding:0 15px;margin-bottom:15px}
#item-list-box i{transform:translate(-130%,-50%)}
.tab-nav li a,.tab-nav li.active a{width:120px;height:120px}
.tab-nav li:first-child:after,.tab-nav li:nth-child(2):after,.tab-nav li:nth-child(3):after{transform:translateY(-120%);font-size:.9rem}
.tab-nav{margin:-150px -1px 0 0}
.newslistbox .tab-nav li.active a,.tab-nav li a,.tab-nav li.active a{font-size:.9rem}
.chart{padding:0 10px}
aside.newsblock nav.nav.nav-tabs{padding-left:0}
p.vicetitle{color:#666;text-align:center;margin-bottom:0;font-size:1.2rem;font-weight:300;line-height:125%}
h4.mastertitle{color:#2b92b8;text-align:center;margin:0;font-size:2rem}
.newbox{padding:5px}
.news-wrap{padding:15px}
.worklistbox div:first-child:after{display:none}
.worklistbox div:first-child{order:3}
.lg-title:after{right:15px}
.lg-title{font-size:1.3rem}
span.address,span.compname{width:65%}
}
@media (max-width:769px){aside#searchui{width:90vw}
.footer-title{transform:translateX(0)}
footer ul:nth-child(2) li{width:50%;display:block}
div#amountbox-inside .row div:first-child{margin-bottom:15px}
div#amountbox-inside .row div:last-child{text-align:center;margin:15px 0}
.newbox{flex:100%}
figure.authorimg{text-align:center}
#room1 ul li img,#room2 ul li img{width:80vw;transition:all .5s ease}
.collectstyle{width:300px!important;transform:translate(0,-6px)!important}
svg#linetitle{width:80%;display:none}
#room1 ul li,#room2 ul li{float:left;padding:0 4px}
.tab-nav li a,.tab-nav li.active a{width:120px;height:120px;font-size:1rem}
.tab-nav li:first-child:after,.tab-nav li:nth-child(2):after,.tab-nav li:nth-child(3):after{transform:translateY(-120%);font-size:.9rem}
#room1{margin:0 0 8px 0}
p.card-text i{transform:translateY(4px) rotate(90deg);transition:all .5s ease}
section#foucus{padding:80px 15px 35px 15px}
.card.col-md.col-sm-12{padding:0;margin-bottom:25px;margin:0 5px}
#searchui .nav-link,#searchui .nav-tabs .nav-link.active{font-size:1rem;padding:10px 0}
#myTabContent span,.formui span.col-md.col-sm-12{padding:0;margin-right:0;margin-bottom:5px}
div#myTabContent .row:last-child span{margin:0}
input#searchbtn{max-width:50%;font-size:1rem;padding:.4rem}
.row.no-gutters.one-point>aside>svg{position:relative;right:0;font-size:5rem;top:50%;transform:translateY(0) rotate(90deg);color:#999}
aside.col-md-3.align-self-center{padding:15px 0}
footer ul:before{display:none}
footer{background-color:#e3e3e3;padding:65px 0 65px 0}
footer ul:nth-child(4){margin-top:15px}
nav#breadstyle{margin-top:0}
a#edit,a#join,a#see,a#top{font-size:.8rem;text-align:center}
i.fa.fa-star.d-block{font-size:1rem}
#header .row{text-align:center}
.col-md-3.images-box,.col-md-4.images-box{font-size:1.2rem;margin-bottom:15px}
a.nextbtn{width:80%}
#graybox p{font-size:1.4rem}
.row.no-gutters.one-point.inside{margin-top:15px;display:none;margin-bottom:15px}
.sidenav .sidenav-menu li{opacity:0}
.sidenav.show .sidenav-menu li:first-child{opacity:1;transition:.5s ease-in;transition-delay:.3s}
.sidenav.show .sidenav-menu li:nth-child(2){opacity:1;transition:.5s ease-in;transition-delay:.5s}
.sidenav.show .sidenav-menu li:nth-child(3){opacity:1;transition:.5s ease-in;transition-delay:.7s}
.sidenav.show .sidenav-menu li:nth-child(4){opacity:1;transition:.5s ease-in;transition-delay:.9s}
.sidenav.show .sidenav-menu li:nth-child(5){opacity:1;transition:.5s ease-in;transition-delay:1.1s}
.sidenav.show .sidenav-menu li:nth-child(6){opacity:1;transition:.5s ease-in;transition-delay:1.3s}
span.col-lg.col-sm-12{margin-bottom:5px;margin-right:0}
ul#chosen-list .owl-next,ul#chosen-list .owl-prev{position:relative;top:inherit;left:inherit;right:inherit;transform:inherit}
a.more{width:55vw;margin:35px auto 35px}
nav#lgnav ul>li{width:100%}
nav#lgnav ul{flex-direction:column;border-bottom:none}
nav#lgnav ul>li a{border-right:none}
#chosen{margin:25px 0 25px 0}
footer ul{text-align:center}
.row.space .col-md-2{text-align:center}
.problembox ul li .col{color:#1e8cb5;padding:10px 15px}
.problembox ul li .col-md-2{text-align:right;margin-bottom:15px}
.u-radio .icon{margin-right:3px}
.u-checkbox,.u-radio{margin:0 3px 0 0;text-align:center}
section.problembox{margin-bottom:25px;margin-left:15px;margin-right:15px}
#exbox{height:inherit}
.ex-xs-title{padding-bottom:15px}
#testbox{height:inherit}
a#starttest{width:50vw}
#picture-step-box .nav-tabs li a{margin:15px auto}
.col-md.false:before,.col-md.ture:before{width:20px;height:30px;position:absolute;left:15px;top:-4px}
.col-md.false,.col-md.ture{padding-left:45px;margin:10px 0}
div#StepContent{padding:0}
.chart{padding:0 25px;border-right:none}
.row.clipbox p{margin:0;font-size:1rem;font-weight:300}
p.vicetitle{margin-bottom:5px;font-size:.9rem}
h4.mastertitle{font-size:2.5rem}
.row.space{margin-bottom:25px;margin-top:25px}
.row.no-gutters.strengthen{margin-bottom:25px}
.ngbox p:first-child{color:#4d4d4d;font-size:1.6rem;padding-bottom:10px}
span.blbeline:before{height:100%;left:-12px;content:'';width:8px;top:0}
aside.newsblock .nav-tabs .nav-link{font-size:1rem;color:#666;flex:20%;padding-bottom:20px}
aside.newsblock nav.nav.nav-tabs{padding-left:0;text-align:center}
aside.newsblock .nav-tabs .nav-link i{transform:rotate(90deg);margin:0;top:15px}
.row.ans .col-md-2,.row.que .col-md-2{text-align:center;margin-bottom:15px}
.talkbox:before{left:inherit;position:absolute;top:-15px;transform:rotate(90deg);right:25px}
#item-list-box i,.item-left:after,.tab-nav li:first-child:after,.tab-nav li:nth-child(2):after,.tab-nav li:nth-child(3):after{display:none}
.tab-nav{margin:-150px -1px 0 0}
.tab-group section{padding:0}
.ready{width:90%}
.item-right ul li{padding:0 10px}
.step-bg p{margin-bottom:25px}
i.material-icons.rotate{font-size:8rem}
.step3-title{margin:15px}
.step-bg p:last-child{text-align:center;font-size:1.6rem}
.slick-slide img{margin:0 auto}
.item-left.col-md-5:before{content:'道具清單';border:none;position:absolute;top:0;color:#fff;left:15px;background-color:#fff;padding:5px 10px;font-size:1rem;background-color:#2086c6}
#greatbox-blue{height:65vh}
h3.qa-title{width:40%}
a.qa-more{font-size:1.2rem;width:100%;margin:0}
.row.qa-box1 div:first-child,.row.qa-box2 div:first-child,.row.qa-box3 div:first-child{padding:0}
.row.qa-box1 div:nth-child(3),.row.qa-box2 div:nth-child(3),.row.qa-box3 div:nth-child(3){margin-top:15px}
.row.qa-box1,.row.qa-box2,.row.qa-box3{height:inherit;background-color:#eef5fc;overflow:hidden;padding:15px 0}
.newbox{flex:100%}
.newslistbox .tab-nav li a i{display:none}
.newslistbox .tab-nav li a,.newslistbox .tab-nav li.active a,.newslistbox .tab-nav li:last-child a{padding:5px;border-right:#ccc solid 1px;font-size:1.2rem;text-align:center}
.newslistbox .tab-nav li.active:last-child a{border-bottom:#ccc solid 1px;padding:5px;text-align:center}
.worklistbox div:nth-child(2){padding-left:0;order:1}
.worklistbox div:last-child{margin:25px 0;order:2}
.worklistbox div:first-child{order:3}
.lg-title:after,.worklistbox div:first-child:after,ul.nav.nav-tabs.bottomnav{display:none}
.col-md.tipbtn{margin-top:10px}
.col-md.tipbtn span{background-color:rgba(0,0,0,.8);color:#fff;padding:5px;position:absolute;bottom:-20px;display:none;width:75%;left:50%;transform:translateX(-50%)}
ul.totalul{text-align:center;margin-bottom:10px}
span.condition{display:inline-block}
.worklistbox div:first-child{padding-right:0}
span.condition{margin:3px}
div#amountbox{padding:15px}
div#amountbox .row div:last-child{margin-top:10px}
span.amount-tip{display:inline-block;margin-right:5px}
.row.three-select div{margin-bottom:15px}
.xl-title{font-size:1.4rem;text-align:center}
.row.result div:first-child{text-align:center}
.row.result div:first-child span{position:relative;font-size:1.4rem}
.row.result div:first-child span:before{content:'';background-color:#0068af;width:10px;height:30px;position:absolute;top:3px;left:0}
.col-md-6.right.align-self-center{text-align:center;margin-top:15px}
.row.result{margin-top:25px;padding-bottom:15px;border-bottom:none;margin-bottom:25px}
#result-a{font-size:1.4rem;width:90%}
a.result-else-a{font-size:1.3rem}
.result-list-title{padding:5px 15px;font-size:1.2rem;font-weight:700;margin-top:10px;margin:10px auto 10px;display:block;width:100%;text-align:center}
div#topnav{margin-bottom:15px}
.nexticon{background-color:#0168af;color:#fff;text-align:center;padding:10px 0;display:block}
.nexticon:hover{color:#fff}
nav#lgnav ul>li a,nav#lgnav ul>li:first-child:before,nav#lgnav ul>li:nth-child(2):before,nav#lgnav ul>li:nth-child(3):before,nav#lgnav ul>li:nth-child(4):before,nav#lgnav ul>li:nth-child(5):before{background-color:#eee}
#select-place:before{content:'最近感到迷惘嗎? 選擇以下地點，尋找你心中的心靈占卜師，前往……';position:absolute;left:50%;top:inherit;bottom:0;transform:translate(-50%,0);z-index:10;width:100%;font-size:.9rem;background-color:rgba(0,0,0,.5);text-align:left;padding:5px 15px;animation-delay:2s}
#select-place .row{flex-direction:column}
#place1 span p:first-child,#place2 span p:first-child,#place3 span p:first-child{font-size:5rem;padding-top:15px}
#place1 span p:last-child,#place2 span p:last-child,#place3 span p:last-child{font-size:1.5rem}
#se-talk span{font-size:1.4rem}
.master-main{font-size:1.2rem}
div#main-box{border-left:#b7a79b solid 1.5px;border-right:#b7a79b solid 1.5px;transform:translateY(0);border-bottom:#b7a79b solid 1.5px;margin-top:-10px}
#se-talk span{transform:translate(-50%);left:50%;margin-left:0}
.recommend a{font-size:1.2rem}
.recommend{margin:15px 0 35px 0}
#bottomblock .col-sm-4 a{padding:8px;margin-bottom:3px}
.sidenav-brand{padding:45px 24px 19px!important}
.step1box .row.no-gutters .col-md-3{position:relative;bottom:0;right:0}
select.resumeNoSelect.form-control-sm{width:100%}
.conditionlist{margin:15px 0 0 0;display:block;text-align:left}
.myligthBox iframe{width:100%!important}
.myligthBox .closeMyligthBox{display:inline-block;padding:0 8px;text-align:center;font-size:22px;border-radius:50%;position:absolute;top:5px!important;right:5px!important;background-color:#333}
#header h2 a{display: block;margin:10px 0 0 0}
}
@media (max-width:577px){#test-tips p{padding:25px}
ul.totalul li:nth-child(3):after{display:none}
ul.totalul li{margin-bottom:10px}
ul#jumpul li{padding-left:22.5%}
#header h1{margin:5px 0 0 0}
.newslistbox .tab-nav{height:inherit;display:flex}
#room1 a span,#room2 a span{font-size:1.3rem}
.newbox{padding:0}
.row.hurry-a,.row.hurry-q{font-size:1.1rem}
ul#hurry-qa-list li{margin:35px 0}
.ecology-title-box{width:95%;transform:translate(-50%,-25%)}
aside.col-md-3.align-self-center a{font-size:1rem}
h2.ecology-md-title{font-size:1.4rem}
a#top img{display:none!important}
h2.test-md-title{color:#fff;font-size:1.3rem;font-weight:300;text-align:center;padding:0 15px;line-height:125%;margin:35px 0}
.perpic{position:relative;border:none;text-align:center;margin-bottom:10px}
a#starttest{background-color:#1e8cb5;color:#fff;padding:5px 10px;font-size:1.4rem;bottom:13vh;text-decoration:none;border:#fff solid 1px;width:50vw}
a#join{padding:5px 5px}
#exbox .col-sm{text-align:center}
figure.ex-img{padding:0 10vw}
h2.ex-md-title{text-align:center;color:#fff;font-size:1.2rem;font-weight:300;margin-bottom:30px;padding:0 15px;margin-top:30px}
.ex-xl-title{color:#fff;font-size:2rem;margin-left:0;text-align:center;margin-bottom:10px}
.ex-xs-title{color:#fff;text-align:center;font-size:1.3rem;padding-bottom:15px}
#testbox i{width:initial}
.step-title2{margin-top:15px}
.sm-footer{text-align:right;margin-top:15px;color:#999;font-size:.85rem}
figure.igbox.col-md-4{text-align:center}
.row.hurry-a{padding-left:0}
.row.clipbox .col.align-self-center{text-align:center}
.tab-nav{margin:-260px -1px 0 0;padding:0;height:inherit;display:flex;flex-wrap:wrap}
.tab-group{margin-top:315px}
.tab-nav li{flex:50%;position:relative;margin-bottom:10px}
.newslistbox .tab-nav li{flex:100%;position:relative;margin-bottom:0}
.tab-nav li.active a:after,.tab-nav li.active a:before{display:none}
.step3-title{border:#0066bf solid 1px;background-color:#fff;display:inline-block;padding:5px 15px;font-size:1.1rem;margin:15px 0}
i.material-icons.rotate{font-size:5rem;transform:rotate(90deg);color:#deeefb;margin-top:-15px}
.step-title3{font-size:1.2rem}
a.edit-lg{font-size:1.4rem}
h3.great-title{font-size:1.3rem}
#greatbox{background-position:left}
.select-example-box a{padding:10px 15px}
.select-example-box a:hover{padding:10px 15px}
.slect-example-title:after{width:50%}
.worklistbox div:first-child a{width:100%}
ul.workmain li:first-child{margin-bottom:15px}
.ngbox p:nth-child(2){font-size:1.6rem}
.ngbox p:nth-child(3){font-size:1.6rem;margin-bottom:15px}
.ngbox2 ul{font-size:1rem}
aside#floatmenu.vis{bottom:0;padding:15px 0}
section#tab4{padding:15px}
.step3box{font-size:1.4rem}
aside#floatmenu{display:flex;width:100%;background-color:#fff}
aside#floatmenu a{width:33.33%;text-align:center;align-self:center;color:#333}
div#amountbox-inside2 p{margin:10px}
#login-before-btn{background-color:#1e8cb5;color:#fff;border-radius:5px;text-decoration:none;display:inline-block;padding:10px 20px;font-size:1rem;box-shadow:0 5px #186a89;margin:0 auto;display:block;text-align:center;width:50%}
ul.workmain li{margin-bottom:10px;color:#666;padding:3px 0;font-size:1.1rem;text-align:center;margin-top:10px}
span.address,span.compname{color:#000;font-weight:700;margin-left:0;display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;width:inherit}
#tipsmessage.vis{opacity:1;transition:all .5s ease;transform:translateY(0);width:80%;position:relative;right:0;bottom:-5px}
ul.totalul li{margin-bottom:10px}
span.address,span.compname{color:#000;font-weight:700;margin-left:0;display:block;margin:5px 0}
ul.workmain li{text-align:center}
#tips-block{width:100vw;height:100%}
span.money{margin-left:0;display:block;text-align:center;margin-top:10px;padding:5px 0}
figure#letter:before{content:'請點選信封！';transform:translate(0,0);position:relative;width:100%;color:#000;z-index:2}
.news-wrap{padding:0;margin-bottom:15px}
a#sidenav-toggle{top:68px}
.startgreat i{bottom:0}
#place1 span p:first-child,#place2 span p:first-child,#place3 span p:first-child{font-size:3rem}
div#master img{width:85%}
.master-title{font-size:1.6rem}
h5.mb-0 a{padding-right:15px}
#graybox p span{font-size:2rem!important}
#room1 ul li img, #room2 ul li img {width: 70vw;transition: all .5s ease;}
span.col-md.col-sm-12:first-child:after {
    content: '▾';
    position: absolute;
    right: 0;
    z-index: 5;
    color: #a5070b;
    font-size: 1.3rem;
    top: 8px;
    right: 8px;
}  
select.form-control.form-control-lg.selectstyle {
    height: 48px;
    padding-left: 50px;
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 1); 
}
    a.exp-icon {
    font-size: 1rem !important;
    border: #218dbb solid 1px;
    padding: 5px;
    text-decoration: none !important;
    margin-left: 0;
    display: block;
    width: 50%;
    margin: 10px auto 0;
    transition: all 0.5s ease;
}

}
@media (max-width:401px){#room1 ul li img, #room2 ul li img {width: 80vw;transition: all .5s ease;}}
@media (max-width:351px){#searchui .nav-link,#searchui .nav-tabs .nav-link.active{font-size:1rem;padding:5px 0}
input.form-control.form-control-lg{font-size:1rem}
aside.newsblock .nav-tabs .nav-link{flex:100%}
aside.newsblock .nav-tabs .nav-link i{transform:rotate(90deg);margin:0 0 0 15px}
a.nav-item.nav-link.active{border-bottom:#8fd6f8 solid 5px;border-top:none;border-right:none;border-left:none}
span.great-step-title{font-size:.9rem}
.ecology-title-box{width:85%;transform:translate(-50%,-50%)}
h2.ecology-md-title{margin:5px;font-size:1rem}
.news-wrap{padding:10px}
ul.workmain li{font-size:.9rem}
#searchui .nav-link:hover{font-size:1rem}
.navicon,div#myTabContent i.fa.fa-search{top:8px}
.master-main,.master-title{font-size:1rem}
#bottomblock .col-sm-4 a{padding:3px}
a.more{width:60vw}
h5.mb-0 a{padding-right:15px}
#header h2{font-size:.9rem}
.newstitle{padding:10px 0 10px 15px}
.newbox{padding:0!important}
aside.col-md-3.align-self-center a,span.blbeline{font-size:1rem}
.ex-xl-title{display:none}
.select-example-box a{padding:10px 0}
#place1 span p:first-child,#place2 span p:first-child,#place3 span p:first-child{font-size:3rem;padding-top:15px;margin-bottom:0}
h1.ecology-title{font-size:2.2rem}
}