#views div,#productWrap div,#productWrap a,#newWrap li,#newWrap li div,#newWrap li a,#newWrap li p,#newWrap li img{ outline:none;margin:0 }
#views .b-de{ background-repeat:no-repeat;background-position:50% 50%;background-size:cover;position:relative;overflow:hidden }
#views .b-de >img{ width:100%;height:100vh;overflow:hidden }
#views .b-de .banner-txt{ position:absolute;right:calc(50% - 360px);top:0;z-index:5;width:483px;text-align:center;padding-top:calc(26% - 100px);max-height:222px;overflow:hidden }
#views .b-de .banner-txt .bb{ width:1px;height:calc(100% - 110px);background:#fff;position:absolute;right:0;top:0;display:block }
#views .b-de .banner-txt .insidebb{ width:7px;height:100%;background:#fff;position:absolute;right:0;top:0;display:block }
#views .b-de .banner-txt .big-t{ overflow:hidden;padding-right:40px;position:relative }
#views .b-de .banner-txt h2,#views .b-de .banner-txt h3,#views .b-de .banner-txt h4,#views .b-de .banner-txt p{ text-align:right;color:#fff;font-weight:lighter;font-size:30px;font-family:'cwTeXHei',serif;line-height:120%;text-shadow:0 0 5px rgba(55,29,69,0.82) }
#views .b-de .banner-txt h3{ font-size:52px }
#views .b-de .banner-txt p{ margin:20px 0 0;font-size:16px;line-height:180%;font-family:"微軟正黑體","蘋果儷中黑","Lucida Grande","Arial","Arial Narrow" }
#views .b-de .banner-txt p{ margin-right:47px }
#views .b-de .banner-txt p a{ color:#fff;display:inline-block;border:1px solid #fff;padding:10px 45px;border-radius:15px;position:relative;font-size:20px;font-weight:700;transition:linear .3s }
#views .b-de .banner-txt p a:hover{ background:#b52420 }
#views .b-de .banner-txt p a img{ display:inline-block;position:absolute;right:-10px;top:10px;animation-name:pointhand;animation-iteration-count:infinite;animation-duration:.7s;animation-direction:alternate;transition:all linear;transform:translate(10px) rotateX(20deg) }
@keyframes pointhand{ 0%{ transform:translate(10px) rotateX(0deg) }
100%{ transform:translate(0px) rotateX(35deg) }
 }#views{ position:relative;margin-top:133px }
#views .bannerbid{ position:absolute;bottom:-8%;left:-2%;width:30% }
#views .bannerribbon{ position:absolute;bottom:-20%;right:0;width:90% }
#views .baScro{ position:absolute;bottom:20px;right:calc(50% - 25px);display:none }
.slick-slide video,.slick-slide iframe,.slick-slide canvas{ position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(1.4);z-index:2 }
.slick-slide video,.slick-slide canvas{ width:auto;transform:scale(1.4) }
#views #banner .banner-class a{ display:block;position:relative;background-repeat:no-repeat;background-position:50%;background-size:cover;height:86vh }
#views div .slick-dots{ bottom:30px }
#banner{ position:relative }
#banner p.more{ padding:20px 0;position:absolute;width:100%;top:87%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center }
#banner p.more a{ margin-right:20px }
#banner p.more a:last-child{ margin-right:0 }
#banner p.more a:before{ position:absolute;width:100%;height:100%;background:#fff;top:0;left:0;transform:translateY(110%);transition:.4s cubic-bezier(.23,1,.32,1);content:"";opacity:.15 }
#banner p.more a font{ font-size:15px;color:#fff;font-weight:400 }
#banner p.more a:hover:before{ transform:translateY(0) }
@media screen and (max-width:1024px){ 
    #views{ margin-top:76px }
    #views .b-de .banner-txt h3{ font-size:40px }
    #views .b-de >img{ height:600px } }
@media screen and (max-width:980px){ 
    #views .b-de .banner-txt{ padding-top:calc(26% - 53px);right:120px;height:175px } }
@media screen and (max-width:768px){ 
    #views .b-de >img{ height:500px }
    #views .b-de .banner-txt{ height:130px;padding-top:calc(26% - 53px);right:40px }
    #views .b-de .banner-txt h3{ font-size:30px }
    #views #banner .banner-class a{ height:60vh }
    p.more{ top:80% }
    p.more a{ padding:8px 30px }
    #views .baScro{ bottom:8px;right:calc(50% - 15px);width:30px }
    #views .b-de .banner-txt h2{ font-size:22px } }
@media screen and (max-width:640px){ 
    #views .b-de >img{ height:400px }
    #views .bannerbid{ bottom:-5%;left:0%;width:40% }
    #views .bannerribbon{ bottom:-15% }
    #banner video,#banner iframe{ display:none }
    #views .b-de .banner-txt{ padding:0;top:initial;bottom:50px;height:auto;right:20px;width:calc(100% - 40px) }
    #views .b-de .banner-txt .big-t{ padding-right:20px }
    #views .b-de .banner-txt h3{ font-size:22px }
    #views .b-de .banner-txt h2{ font-size:16px }
    #views .baScro{ width:30px;right:calc(50% - 15px);bottom:10px }
    .slick-slide img{ height:300px } }
@media screen and (max-width:480px){ 
    #views{ margin-top:67px }
    #views a{ background-position:33% 50% }
    p.more{ top:75% } }
@media screen and (max-width:450px){ 
    #views a{ background-position:45% 50% }
    #views #banner .banner-class a{ height:40vh } }