/*fan in*/html,body,button{margin:0;padding:0;font-family:"微軟儷黑體","微軟正黑體",Arial,Helvetica,Geneva,sans-serifs}html{font-size:10pt;color:#5f5855}body{width:100%;min-width:1366px}.wrap{display:block;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;scroll-behavior:smooth}.ismobile .wrap{position:relative;overflow:visible}a,a:hover,a:active{text-decoration:none;color:inherit}.abtn{position:absolute;display:block;background-color:rgba(0,0,0,0)}.local .abtn{background-color:rgba(255,0,0,.6)}.abtn img{width:100%;height:100%}.csr{cursor:pointer}.content{display:block;min-height:500px}.relbox{position:relative;display:block;width:100%;height:100%}.wmid{margin:auto;width:100%;max-width:1366px;box-sizing:border-box}.sec{width:100%;display:block}.hide{display:none}.tleft{text-align:left}.tjustfy{text-align:justify}.tright{text-align:right}.tcenter{text-align:center}.full{width:100%;display:block}@media screen and (max-width:1280px){html{font-size:1vw}.wmid{padding:0 10px}}@media screen and (max-width:640px){button,select,a:active,a:focus,a:hover{-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:transparent;outline:none!important;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.content{display:block;min-height:auto}}.header{height:170px;background-repeat:repeat-x;text-align:center;position:absolute;z-index:20;left:0;top:0}.header{width:100%;min-width:1366px}.header .menu{display:table;margin:0 auto}.header .menu li{margin:0;padding:0 0;display:table-cell;line-height:140px;vertical-align:middle}.header .menu li a{display:block;min-height:80px}.header .menu li img{vertical-align:middle}.header .menu li.b{cursor:pointer;transition:all 0.3s}.header .menu li.b:hover{transform:translateY(-10px)}.header .menu .logo{margin-right:50px}.header .menu .clogo{margin:0 30px}.header .menu .fb,.header .menu .line{margin-left:20px}.wrap{font-family:"微軟儷黑體","微軟正黑體",Arial,Helvetica,Geneva,sans-serifs}.wrap fieldset.htitle{border:0 solid rgba(0,0,0,0);border-top:1px solid #cdcdcc;margin:20px 0}.wrap fieldset.htitle>legend{color:#000;margin:auto;padding:0 20px;font-size:14pt;width:auto}.tb{display:table;width:100%}.tb .tr{display:table-row}.tb .td{display:table-cell;vertical-align:top;padding:10px;box-sizing:border-box}input[type=text],textarea{padding:5px;box-sizing:border-box;font-size:10pt;border:1px solid #cdcdce}form i.err{font-style:normal;color:red}@media screen and (max-width:640px){.wrap fieldset.htitle>legend{padding:0 10px;font-size:11pt}}.header{height:170px;background-repeat:repeat-x;text-align:center;position:absolute;z-index:20;left:0;top:0}.header{width:100%;min-width:1366px}.header .menu{display:table;margin:0 auto}.header .menu li{margin:0;padding:0 0;display:table-cell;line-height:140px;vertical-align:middle}.header .menu li a{display:block;min-height:80px}.header .menu li img{vertical-align:middle}.header .menu li.b{cursor:pointer;transition:all 0.3s}.header .menu li.b:hover{transform:translateY(-10px)}.header .menu .logo{margin-right:50px}.header .menu .clogo{margin:0 30px}.header .menu .fb,.header .menu .line{margin-left:20px}[data-scrollbar],[scrollbar],scrollbar{display:block;position:relative}[data-scrollbar] .scroll-content,[scrollbar] .scroll-content,scrollbar .scroll-content{-webkit-transform:translateZ(0);transform:translateZ(0)}[data-scrollbar].sticky .scrollbar-track,[scrollbar].sticky .scrollbar-track,scrollbar.sticky .scrollbar-track{background:hsla(0,0%,87%,.75)}[data-scrollbar] .scrollbar-track,[scrollbar] .scrollbar-track,scrollbar .scrollbar-track{position:absolute;opacity:0;z-index:1;transition:opacity .5s ease-out,background .5s ease-out;background:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}[data-scrollbar] .scrollbar-track.show,[data-scrollbar] .scrollbar-track:hover,[scrollbar] .scrollbar-track.show,[scrollbar] .scrollbar-track:hover,scrollbar .scrollbar-track.show,scrollbar .scrollbar-track:hover{opacity:1}[data-scrollbar] .scrollbar-track:hover,[scrollbar] .scrollbar-track:hover,scrollbar .scrollbar-track:hover{background:hsla(0,0%,87%,.75)}[data-scrollbar] .scrollbar-track-x,[scrollbar] .scrollbar-track-x,scrollbar .scrollbar-track-x{bottom:0;left:0;width:100%;height:8px}[data-scrollbar] .scrollbar-track-y,[scrollbar] .scrollbar-track-y,scrollbar .scrollbar-track-y{top:0;right:0;width:4px;height:100%}[data-scrollbar] .scrollbar-thumb,[scrollbar] .scrollbar-thumb,scrollbar .scrollbar-thumb{position:absolute;top:0;left:0;width:4px;height:8px;background:rgba(0,0,0,.5);border-radius:4px}[data-scrollbar] .overscroll-glow,[scrollbar] .overscroll-glow,scrollbar .overscroll-glow{position:absolute;top:0;left:0;width:100%;height:100%}html,body,button{margin:0;padding:0;font-family:"微軟儷黑體","微軟正黑體",Arial,Helvetica,Geneva,sans-serifs}html{font-size:10pt;color:#5f5855}body{width:100%;min-width:1366px}.wrap{display:block;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;scroll-behavior:smooth}.ismobile .wrap{position:relative;overflow:visible}a,a:hover,a:active{text-decoration:none;color:inherit}.abtn{position:absolute;display:block;background-color:rgba(0,0,0,0)}.local .abtn{background-color:rgba(255,0,0,.6)}.abtn img{width:100%;height:100%}.csr{cursor:pointer}.content{display:block;min-height:500px}.relbox{position:relative;display:block;width:100%;height:100%}.wmid{margin:auto;width:100%;max-width:1366px;box-sizing:border-box}.sec{width:100%;display:block}.hide{display:none}.tleft{text-align:left}.tjustfy{text-align:justify}.tright{text-align:right}.tcenter{text-align:center}.full{width:100%;display:block}@media screen and (max-width:1280px){html{font-size:1vw}.wmid{padding:0 10px}}@media screen and (max-width:640px){button,select,a:active,a:focus,a:hover{-webkit-tap-highlight-color:rgba(0,0,0,0);tap-highlight-color:transparent;outline:none!important;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.content{display:block;min-height:auto}}.wrap{font-family:"微軟儷黑體","微軟正黑體",Arial,Helvetica,Geneva,sans-serifs}.wrap fieldset.htitle{border:0 solid rgba(0,0,0,0);border-top:1px solid #cdcdcc;margin:20px 0}.wrap fieldset.htitle>legend{color:#000;margin:auto;padding:0 20px;font-size:14pt;width:auto}.tb{display:table;width:100%}.tb .tr{display:table-row}.tb .td{display:table-cell;vertical-align:top;padding:10px;box-sizing:border-box}input[type=text],textarea{padding:5px;box-sizing:border-box;font-size:10pt;border:1px solid #cdcdce}form i.err{font-style:normal;color:red}@media screen and (max-width:640px){.wrap fieldset.htitle>legend{padding:0 10px;font-size:11pt}}.sec-fan {
/*sec-fan*/ }
.sec-fan .qs {
/*qsani------------------------------------------------------------------*/ }
.sec-fan .qs .ql {
opacity: 0;
transform: translateX(15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs .qr {
opacity: 0;
transform: translateX(-15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs .qc1 {
opacity: 0;
transform: translateY(15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs .qc2 {
opacity: 0;
transform: translateY(15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs .qc3 {
opacity: 0;
transform: translateY(15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs .qstart {
opacity: 0;
transform: translateY(15%);
transition: all 0.3s;
transition-delay: 0s; }
.sec-fan .qs[class~=on] .ql {
opacity: 1;
transform: translateX(0%);
transition: all 1.8s 0.1s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qr {
opacity: 1;
transform: translateX(0%);
transition: all 1.8s 0.5s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qc1 {
opacity: 1;
transform: translateY(0%);
transition: all 1.8s 0.3s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qc2 {
opacity: 1;
transform: translateY(0%);
transition: all 1.8s 1s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qc3 {
opacity: 1;
transform: translateY(0%);
transition: all 1.8s 1.6s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qstart {
opacity: 1;
transform: translateY(0%);
transition: all 1.8s 2s cubic-bezier(0.12, 0.59, 0.31, 1.02);
/* tgt duration delay motion */ }
.sec-fan .qs[class~=on] .qstart img {
transform: scale(1, 1);
transition: all 0.3s ease-in-out; }
.sec-fan .qs[class~=on] .qstart img:hover {
transform: scale(1.1, 1.1); }
.c-fan {
background-image: url("../img/ubg.jpg"); }
.sec-fan {
padding-top: 220px;
padding-bottom: 200px;
/*start*/
/*end .secfan*/ }
.sec-fan .qs img {
position: absolute; }
.sec-fan .qs .ql {
left: -45px;
top: 32%; }
.sec-fan .qs .qr {
right: 50px;
top: 17%; }
.sec-fan .qs .qc1 {
left: 50%;
top: 22%;
margin-left: -223px; }
.sec-fan .qs .qc2 {
left: 50%;
top: 42%;
margin-left: -302px; }
.sec-fan .qs .qc3 {
left: 50%;
top: 62%;
margin-left: -220px; }
.sec-fan .qs .qstart {
position: absolute;
left: 50%;
top: 71%;
margin-left: -235px;
cursor: pointer;
width: 480px;
height: 44px;
display: block; }
.sec-fan .qna .qt {
position: absolute;
left: -50px;
top: -50px; }
.sec-fan .qna .qres {
position: absolute;
left: 50px;
top: 50px; }
.sec-fan .qna .qshare {
position: absolute;
left: 420px;
top: 680px;
cursor: pointer;
transition: all 0.3s; }
.sec-fan .qna .qshare:hover {
transform: scale(1.1, 1.1); }
.sec-fan .qna .qa {
position: absolute;
left: 650px;
top: 190px;
width: 380px;
border: 0px solid #f00; }
.sec-fan .qna .ab {
display: block;
width: 100%;
height: 65px;
margin-bottom: 18px;
font-size: 22pt;
color: #5d6568;
border: 1px solid #5d6568;
border-radius: 10px;
text-align: center;
line-height: 70px;
cursor: pointer; }
.sec-fan .qna .ab:hover {
background-color: #f6bcbc; }
.sec-fan .qna .ab[class~=on] {
background-color: #f6bcbc; }
.sec-fan .qna .qnext {
position: absolute;
left: 800px;
top: 530px;
cursor: pointer; }
.sec-fan .sharebox {
position: fixed;
left: 0px;
top: 0px;
height: 0%;
width: 0%;
z-index: 21; }
.sec-fan .sharebox .close {
position: absolute;
right: 0px;
top: 0px;
width: 80px;
height: 80px; }
.sec-fan .sharebox .bg {
position: fixed;
background: rgba(255, 255, 255, .8);
left: 0px;
top: -100%;
height: 100%;
width: 100%;
opacity: 0;
transition: opacity 0.3s; }
.sec-fan .sharebox .inbox {
position: fixed;
left: 50%;
top: -100%;
height: 669px;
width: 622px;
margin-left: -311px;
margin-top: -335px;
display: none;
background: no-repeat url(../img/fan/shareinbox.png); }
.sec-fan .sharebox .inbox .sharepic {
position: absolute;
top: 8px;
left: 80px; }
.sec-fan .sharebox .inbox .sharefb {
position: absolute;
top: 580px;
left: 70px; }
.sec-fan .sharebox .inbox .shareline {
position: absolute;
top: 580px;
left: 320px; }
.sec-fan .sharebox[class~=on] .bg {
opacity: 1;
top: 0px; }
.sec-fan .sharebox[class~=on] .inbox {
display: block;
top: 50vh;
animation-name: sboxani;
animation-fill-mode: forword;
animation-duration: 0.5s; }
@keyframes sboxani {
from {
opacity: 0;
transform: translateY(-10%); }
to {
opacity: 1;
transform: translateY(0%); } }