@import url('https://fonts.googleapis.com/earlyaccess/notosanstc.css');@font-face{font-family:'Roboto';font-style:normal;font-weight:300;src:local('Roboto Light'), local('Roboto-Light'), url(https://fonts.gstatic.com/s/roboto/v18/KFOlCnqEu92Fr1MmSU5fBBc9.ttf) format('truetype')}@font-face{font-family:'Roboto';font-style:normal;font-weight:400;src:local('Roboto'), local('Roboto-Regular'), url(https://fonts.gstatic.com/s/roboto/v18/KFOmCnqEu92Fr1Mu4mxP.ttf) format('truetype')}h1{font-size:2.5rem;font-weight:lighter;line-height:1}h2{font-size:2.5rem;font-weight:lighter;line-height:1}h3{font-size:2.5rem;font-weight:lighter;line-height:1}h4{font-size:1.7rem;font-weight:lighter;line-height:1.6}h5{font-size:1.3rem;font-weight:lighter;line-height:1.2}h6{font-size:1rem;font-weight:lighter;line-height:1}p{font-size:1.3rem;font-weight:lighter;line-height:1.8;letter-spacing:.1rem}p .bold{font-weight:bold}p .italic{font-style:italic}a{text-decoration:none}:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}::-moz-selection{color:white;background-color:#004D96}::selection{color:white;background-color:#004D96}html{font-size:75%;font-weight:lighter;font-family:'Microsoft JhengHei', '微軟正黑體', 'Noto Sans TC', sans-serif;letter-spacing:.1rem}body{padding-top:100px}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){body{padding-top:60px}}.breakpoint{position:relative;padding-left:50px;padding-right:50px;margin:0 auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}@media only screen and (min-width:1200px){.breakpoint{width:1170px}}@media only screen and (min-width:992px) and (max-width:1199px){.breakpoint{width:970px}}@media only screen and (min-width:768px) and (max-width:991px){.breakpoint{width:750px;padding-left:30px;padding-right:30px}}@media only screen and (max-width:320px),only screen and (max-width:767px){.breakpoint{padding-left:15px;padding-right:15px}}.contentWrap{padding-top:65px}@media only screen and (max-width:767px){.contentWrap{padding-top:45px}}header{position:fixed;top:0;left:0;z-index:10000;width:100%;height:100px;background-color:#FFF}header .logo{position:absolute;left:40px;top:50%;-webkit-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-o-transform:translate(0, -50%);-ms-transform:translate(0, -50%);transform:translate(0, -50%)}header #navbar{display:none}header .navbar{display:none}header nav ul.main{float:right;margin-right:40px}header nav ul.main>li{float:left}header nav ul.main>li>span{display:block;color:#666;font-size:1.3rem;line-height:100px;padding-left:20px;padding-right:20px;cursor:pointer}header nav ul.main>li .lv2{display:none;position:absolute;z-index:0;top:100px;left:0px;width:100%;padding-top:20px;padding-bottom:20px;background-color:#004D96;text-align:center}header nav ul.main>li .lv2 li{display:inline-block;padding-left:60px;padding-right:60px;border-left:1px solid rgba(255, 255, 255, 0.5)}header nav ul.main>li .lv2 li:first-child{border-left:none}header nav ul.main>li .lv2 li a{color:#FFF}header nav ul.main>li .lv2 li a img{display:block;width:125px;height:auto;margin:10px auto 0}header nav ul.main>li .lv2 li a span{display:block;color:#FFF;font-size:1.3rem;line-height:1;text-align:center}header nav ul.main>li.actived span{color:#FFF;background-color:#004D96}header nav ul.main>li.actived .lv2{z-index:10;display:block;height:15px;overflow:hidden}header nav ul.main>li.actived .lv2 img{display:none}@media only screen and (min-width:992px) and (max-width:1199px),only screen and (min-width:1200px){header nav ul.main>li:hover span{color:#FFF;background-color:#004D96}header nav ul.main>li:hover .lv2{display:block;z-index:20}}header nav ul.main>li.lang{position:relative;line-height:100px;padding-left:20px;height:100px}header nav ul.main>li.lang a{display:block;width:28px;color:#666;font-size:1.3rem;line-height:28px;text-align:center;border:1px solid #666;margin-top:35px}header nav ul.main>li.lang a:hover{color:#004D96;border:1px solid #004D96}header nav ul.main>li.lang .lv2{width:30px;height:100%;left:10px;padding-top:0;padding-bottom:0;padding-left:10px;padding-right:10px}header nav ul.main>li.lang .lv2 li{padding-top:10px;padding-bottom:10px;padding-left:0;padding-right:0;display:block;border:none;border-bottom:1px solid #FFF}header nav ul.main>li.lang .lv2 li:nth-child(2){border-bottom:none}header nav ul.main>li.lang .lv2 li a{color:#FFF;margin-top:0;line-height:28px;border:1px solid #004D96}header nav ul.main>li.lang .lv2 li a:hover{border:1px solid #FFF}header nav ul.main:after{content:"";display:block;clear:both}header nav ul.sub{position:absolute;z-index:10;right:0px;top:50vh;-webkit-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-o-transform:translate(0, -50%);-ms-transform:translate(0, -50%);transform:translate(0, -50%)}header nav ul.sub>li{margin-right:20px;margin-bottom:30px}header nav ul.sub>li>a{position:relative;display:block;width:1.3rem}header nav ul.sub>li>a:after{content:"";position:absolute;z-index:0;top:-10px;right:-20px;display:block;background-color:#004D96;width:0;height:calc(100% + 20px);-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}@media only screen and (min-width:992px) and (max-width:1199px),only screen and (min-width:1200px){header nav ul.sub>li>a:hover span{color:#FFF;text-shadow:0 0 0 rgba(255, 255, 255, 0.8)}header nav ul.sub>li>a:hover:after{width:calc(100% + 30px)}}header nav ul.sub>li>a span{position:relative;z-index:10;color:#666;font-size:1.3rem;letter-spacing:0;line-height:1.1;text-shadow:1px 1px 0px #ffffff;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}header nav ul.sub>li.mail{position:relative}header nav ul.sub>li.mail:before{content:"";position:absolute;z-index:10;top:24px;right:7px;display:block;width:1px;height:0;background-color:#FFF;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}header nav ul.sub>li.mail:after{content:"";display:block;position:absolute;z-index:0;top:-10px;right:-20px;background-color:#004D96;width:0;height:100px;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}header nav ul.sub>li.mail:hover:before{height:50px}header nav ul.sub>li.mail:hover:after{width:calc(100% + 230px)}header nav ul.sub>li.mail:hover span{background-image:url(../images/header-icon-mail-actived.png)}header nav ul.sub>li.mail:hover .lv2{display:block;opacity:1}header nav ul.sub>li.mail span{position:absolute;z-index:10;left:-2px;display:block;width:20px;height:16px;background-image:url(../images/header-icon-mail.png);background-repeat:no-repeat}header nav ul.sub>li.mail .lv2{display:none;position:absolute;z-index:10;top:5px;left:-200px;opacity:0}header nav ul.sub>li.mail .lv2 li{color:#FFF;font-size:1rem;line-height:2}header nav ul.sub>li.mail .lv2 li a{color:#FFF}header nav ul.sub>li.mail .lv2 li a:hover{text-decoration:underline}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){header{height:auto;min-height:60px}header a.logo{left:15px;top:15px;-webkit-transform:translate(0);-moz-transform:translate(0);-o-transform:translate(0);-ms-transform:translate(0);transform:translate(0)}header a.logo img{width:160px;height:auto}header #navbar{position:absolute;-webkit-appearance:none;cursor:pointer;left:-100%;top:-100%}header #navbar:checked~nav{height:calc(100vh - 60px)}header .navbar{display:block;position:absolute;right:15px;top:14px;width:25px;height:18px;border:1px solid #808080;padding:7px 5px}header .navbar label{position:absolute;left:0;top:0;width:100%;height:100%;cursor:pointer}header .navbar .box{position:relative}header .navbar .box .bar{position:absolute;top:0;left:0;width:25px;height:2px;background-color:#808080;-webkit-transition:0.3s;-o-transition:0.3s;transition:0.3s}header .navbar .box .bar:nth-child(2){top:8px}header .navbar .box .bar:nth-child(3){top:16px}header .navbar.actived .bar:first-child{top:8px;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-o-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}header .navbar.actived .bar:nth-child(2){left:10px;opacity:0}header .navbar.actived .bar:nth-child(3){top:8px;-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}header nav{width:100%;height:0;overflow:scroll;margin-top:60px;background-color:#FFF;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}header nav ul.lv1.main{float:none;margin-right:0;background-color:#FFF}header nav ul.lv1.main>li{position:relative;float:none;padding-left:0px;padding-right:0px;border-top:1px solid rgba(128, 128, 128, 0.3)}header nav ul.lv1.main>li:after{content:"";display:block;clear:both}header nav ul.lv1.main>li>span{color:#808080;font-size:1.3rem;line-height:60px;padding:0 15px}header nav ul.lv1.main>li .lv2{display:none;position:relative;top:initial;height:initial;padding-top:0;padding-bottom:0;background-color:rgba(128, 128, 128, 0.1);text-align:left}header nav ul.lv1.main>li .lv2 li{display:block;padding-left:0;padding-right:0}header nav ul.lv1.main>li .lv2 li a{display:block}header nav ul.lv1.main>li .lv2 li a span{color:#808080;text-align:left;line-height:40px;padding-left:15px;padding-right:15px}header nav ul.lv1.main>li .lv2 li a img{display:none}header nav ul.lv1.main>li.lang{line-height:45px;padding-left:0;height:auto;text-align:center}header nav ul.lv1.main>li.lang>a{display:inline-block;vertical-align:middle;margin-top:0;margin-left:5px;margin-right:5px;background-color:#808080;border:1px solid #808080;color:#FFF}header nav ul.lv1.main>li.lang .lv2{width:initial;display:inline-block;vertical-align:middle;text-align:center;padding-left:0;padding-right:0;left:initial;background-color:transparent}header nav ul.lv1.main>li.lang .lv2 li{display:inline-block;padding:7px 0}header nav ul.lv1.main>li.lang .lv2 li a{display:inline-block;border:1px solid #808080;margin-left:5px;margin-right:5px;color:#808080}header nav ul.lv1.main>li.actived span{color:#FFF}header nav ul.lv1.main>li.actived .lv2{height:inherit}header nav ul.lv1.main>li.actived .lv2 li{border-left:none}header nav ul.lv1.main>li.actived .lv2 li a span{color:#FFF;background-color:rgba(0, 77, 150, 0.9)}header nav ul.lv1.sub{position:relative;top:initial;-webkit-transform:translate(0);-moz-transform:translate(0);-o-transform:translate(0);-ms-transform:translate(0);transform:translate(0)}header nav ul.lv1.sub>li{margin:0;border-top:1px solid rgba(128, 128, 128, 0.3)}header nav ul.lv1.sub>li:first-child{border-top:none}header nav ul.lv1.sub>li>a{width:initial;padding:0 15px;line-height:60px}header nav ul.lv1.sub>li.mail{display:none}}footer{position:relative;z-index:9999;background-color:#FFF}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer{background-color:#112234}}footer #gotop{position:absolute;right:45px;top:-85px;width:100px;height:85px;background-color:#1babe0;overflow:hidden;cursor:pointer}footer #gotop span{position:relative;display:block;width:100%;height:100%}footer #gotop span:before{content:"";display:block;width:57px;height:10px;background-image:url(../images/arrow-white.png);position:absolute;left:50%;bottom:10px;margin-left:-28px;-webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg);-o-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}footer #gotop span:after{content:"Top";display:block;height:85px;overflow:hidden;color:#FFF;font-size:1rem;text-align:center;line-height:40px;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer #gotop span:after{line-height:85px}}footer #gotop span:hover:before{bottom:16px}footer #gotop span:hover:after{letter-spacing:5px;text-indent:5px}@media only screen and (min-width:768px) and (max-width:991px){footer #gotop{top:-60px;right:20px;width:60px;height:60px}footer #gotop span:before{display:none}footer #gotop span:after{line-height:60px}}@media only screen and (max-width:767px){footer #gotop{position:relative;width:100%;height:60px;top:initial;right:initial}footer #gotop span:before{display:none}footer #gotop span:after{line-height:60px}}footer .sitemap{background-color:#112234;padding-top:60px;padding-bottom:70px}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .sitemap{display:none}}footer .sitemap nav:after{content:"";display:block;clear:both}footer .sitemap nav ul{width:calc((100% - 80px) / 6);float:left}footer .sitemap nav ul.sub li a{display:block;color:#FFF;font-size:1.3rem;line-height:1;opacity:0.5;margin-top:3rem;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}footer .sitemap nav ul.sub li a:hover{opacity:1}footer .sitemap nav ul.sub li:first-child a{margin-top:0}footer .sitemap nav ul.product.social{width:80px}footer .sitemap nav ul.product span{display:block;color:#1babe0;font-size:1.3rem;margin-bottom:1.6rem}footer .sitemap nav ul.product a{color:#FFF;font-size:1.3rem;line-height:2;opacity:0.5;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}footer .sitemap nav ul.product a:hover{opacity:1}footer .sitemap nav ul.product a.youtube{display:block;width:32px;height:39px;background-image:url(../images/footer-icon-youtube.png);background-repeat:no-repeat;text-indent:-9999px;margin-left:10px}footer .main{width:calc(100% - 80px);margin:0 auto;padding-top:25px;padding-bottom:55px}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main{text-align:center;padding-bottom:25px}}footer .main:after{content:"";display:block;clear:both}footer .main a.logo{display:block;float:left;margin-right:50px}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main a.logo{display:none}}footer .main ul{float:left}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main ul{display:none}}footer .main ul li{color:#808080;font-size:1.3rem;line-height:1.6}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main ul li{font-size:1rem;line-height:1.2}}footer .main ul li a{color:#808080;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}footer .main ul li a:hover{color:#1babe0}footer .main .floatRight{float:right;text-align:right;color:#000;font-size:1.1rem;font-weight:normal;line-height:1.3}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main .floatRight{float:none;margin:0;padding:0;border-top:none;color:#FFF;font-size:1rem;line-height:1.4;text-align:center}}footer .main .floatRight a{display:inline-block;color:#000;font-size:1.1rem;margin-bottom:5px;-webkit-transition:0.2s;-o-transition:0.2s;transition:0.2s}footer .main .floatRight a:hover{color:#1babe0}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main .floatRight a{color:#FFF;font-size:1rem;font-weight:lighter;line-height:1.4}}footer .main .floatRight p{color:#808080;font-size:1.1rem}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){footer .main .floatRight p{color:rgba(255, 255, 255, 0.6);font-size:1rem;line-height:1.4}}.banner{position:relative;height:215px;background-position:center;-webkit-background-size:cover;-o-background-size:cover;background-size:cover}@media only screen and (max-width:767px){.banner{height:120px}}.banner .breakpoint{height:100%}.banner .breakpoint .crumb{position:absolute;z-index:10;left:0;bottom:0;padding-left:60px;padding-right:60px;-webkit-transform:translate(0, 0%);-moz-transform:translate(0, 0%);-o-transform:translate(0, 0%);-ms-transform:translate(0, 0%);transform:translate(0, 0%)}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){.banner .breakpoint .crumb{padding-left:30px;padding-right:30px}}.banner .breakpoint .crumb:before{content:"";display:block;position:absolute;z-index:0;right:0;bottom:-6px;width:calc(100% - 60px);height:6px;background-color:#1babe0}@media only screen and (max-width:767px),only screen and (min-width:768px) and (max-width:991px){.banner .breakpoint .crumb:before{width:calc(100% - 30px)}}.banner .breakpoint .crumb:after{content:"";display:block;position:absolute;z-index:0;left:0;top:0;width:100%;height:100%;background-color:rgba(26, 26, 26, 0.6)}.banner .breakpoint .crumb a{display:inline-block;position:relative;z-index:10;color:#FFF;font-size:2rem;line-height:62px;padding-left:3.5rem}.banner .breakpoint .crumb a:after{content:">";display:block;position:absolute;left:1.2rem;top:0;color:#FFF;font-size:2rem;line-height:62px}.banner .breakpoint .crumb a:first-child{padding-left:67px}.banner .breakpoint .crumb a:first-child:before{content:"";display:block;position:absolute;z-index:10;left:0;top:50%;width:52px;height:33px;background-image:url(../images/banner-icon.png);background-position:left center;background-repeat:no-repeat;-webkit-transform:translate(0, -50%);-moz-transform:translate(0, -50%);-o-transform:translate(0, -50%);-ms-transform:translate(0, -50%);transform:translate(0, -50%)}@media only screen and (max-width:767px){.banner .breakpoint .crumb a:first-child:before{display:inline-block;vertical-align:middle;position:relative;height:62px;line-height:62px;-webkit-transform:translate(0);-moz-transform:translate(0);-o-transform:translate(0);-ms-transform:translate(0);transform:translate(0)}}.banner .breakpoint .crumb a:first-child:after{display:none}@media only screen and (max-width:767px){.banner .breakpoint .crumb a{display:none}.banner .breakpoint .crumb a:last-child{display:inline-block;vertical-align:middle;padding-left:15px;font-size:1.7rem}.banner .breakpoint .crumb a:last-child:after{display:none}}
footer .sitemap nav ul.product.nanya_mall a{line-height:1.3rem;}
footer .sitemap nav ul.product.nanya_mall span{transform:translateY(-3px);}
.nanya_mall a img{width: 100%; max-width: 180px; display: block;}
footer .sitemap nav ul.nanya_mall{width: 180px;}
header nav ul.main>li .lv2 li a img {width: 200px;}
footer .sitemap nav ul {width: 120px; padding-left: 10px;}
@media only screen and (min-width: 992px) and (max-width: 1199px){
.product {height: auto!important;}
footer .sitemap nav ul {width: 88px;}
}
@media (min-width: 992px) {
    header nav ul.main>li>span{color:#000;font-weight:bolder;font-size:1.5rem;}
    header nav ul.sub>li>a:after{background-color:#FFF; color:#000;}
    header nav ul.sub>li>a:hover span{
        color: #000;
    }
    header nav ul.sub>li>a span{color:#FFF;font-size:1.5rem;
    font-weight: bolder;text-shadow:none;}
    header nav ul.sub{    
        background-color: #004D96;
        padding-left: 10px;
        padding-top: 10px;
        padding-bottom: 30px;
        border-radius:3px 0 0 3px;
    }
    header nav ul.sub>li.mail span {
        background-image: url(../images/header-icon-mail-actived.png);
    }
    header nav ul.main>li.lang a{color:#000;}
}
@media (max-width: 991px) {
    header nav ul.sub > li > a span{font-size:1.5rem;font-weight:bolder;color:#000;}
    header nav ul.lv1.main>li>span {
        color: #000;
        font-size: 1.5rem;
        font-weight:bolder;
    }
}