/*top button*/
html {scroll-behavior: smooth} @media screen and (prefers-reduced-motion: reduce) {html {scroll-behavior: auto}}
a.top {position:absolute;top:0;right:30px;width:12px;writing-mode: vertical-lr;text-orientation:mixed;color: #6a6a6a;padding: 11em 0 0;font-family: Myriad Pro}
a.top:before {position: absolute;top:0;content:"";right:6px;width: 1px;height: 10em;background-color: #6a6a6a}
.sp {display: none;}

html, body, h1, h2, h3, h4, h5, h6, p, a {font-family: 'Microsoft JhengHei', sans-serif, Arial, Helvetica, sans-serif;font-size: 100%;margin: 0;}
a {text-decoration: none;outline: medium none;hlbr: expression(this.onFocus=this.blur());}
ul {padding:0;list-style-type: none;}
a, a:active, a:focus, a:hover{outline: none;-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;text-decoration: none;}

body {overflow-x: hidden;}
header {position: absolute;left:50%;width: 100%;z-index: 99;max-width:1920px;margin: 0 auto;transform: translateX(-50%);}
header > div {height: 95px}
header .inner {position: relative;width: 100%;max-width: 90%;}
.navbar {display:none}
.navbar-inverse {background-color: transparent;border-color: transparent;margin:0;border:none}
.navbar-inverse .navbar-nav>li>a {color:#fff;padding:12px 35px}
header .home, header .contact, header .order, header .booking-line, .navbar-toggle {display:none}


.logo {position:absolute;top:15px;left:15px;color: #1a1a1a;}
.logo:hover {color: #1a1a1a}
.logo img {width:auto;height:68px;vertical-align:top;display: inline-block;}
.logo a {color: #1a1a1a}
.overlay {height: 0%;width: 100%;position: fixed;z-index: 10;top: 0;left: 0;background-color:#2a2a2a;overflow-y: hidden;transition: 0.5s;}
.overlay-content {position: relative;top: 25%;width: 100%;text-align: center;margin-top: 30px;}
.overlay a {padding: 8px;text-decoration: none;font-size: 36px;color: #818181;display: block;transition: 0.3s;}
.overlay a:hover, .overlay a:focus {color: #bc0d23;}
.overlay .closebtn {position: absolute;top: 20px;right: 45px;font-size: 60px;}
.mobile {display:none!important;}
.brand-logo {position:absolute;top:0;left:10%;z-index:4}

#menubox {position: absolute;bottom:0;right: 0;display: block;z-index: 9;font-size: 16px}
ul.unit-menu {display: block;text-align:center;position: relative;margin:0;line-height: 95px;}
ul.unit-menu li {position: relative;display:inline-block;min-width: 95px;line-height: 40px;}
ul.unit-menu li>a {color: #fff;}
ul.unit-menu li:hover span, ul.unit-menu a.active {color: #fccf03;}
ul.unit-menu>li:last-child a {display:inline;}
ul.unit-menu>li:last-child a.tw {position: relative;}
ul.unit-menu>li:last-child a.tw:after {position: absolute;top:50%;right:0;content:'';height: 12px;width: 1px;background: #fff;opacity: .5;transform: translateY(-50%);}
ul.unit-menu>li:last-child a {color: #fff;font-family: Microsoft JhengHei;padding: 0 .8rem;}
ul.unit-menu>li:last-child a:hover, ul.unit-menu li:last-child a.active {color:#fccf03}
ul.unit-menu .dropdown-menu {background-color: rgba(0, 0, 0, 0.5);border-radius:0;opacity:0;transition: 0.5s;display:block;visibility: hidden;}
ul.unit-menu .dropdown-item {color: #fff!important;}
ul.unit-menu .dropdown-item:hover {background: transparent;color: #e70e12!important;}
ul.unit-menu li.dropdown:hover ul.dropdown-menu {opacity:1;transition: 0.5s;visibility: visible;}
ul.dropdown-menu li {display: block!important;width: 100%!important;}
ul.dropdown-menu li>a {color:#fff;padding:0 15px;display:block;}
ul.dropdown-menu li>a:hover {color:#e70e11;}
#button:focus {outline: 0;border: none;background: transparent!important;color: #000!important;}
button:focus:not(.swal2-styled):not(.swal2-confirm):not(.swal2-cancel) {
    outline: 0;
    border: none;
    background: transparent !important;
    color: #000 !important;
}

#menubox .nav_contact {display: block;border-radius: 99px;line-height: 42px;color:#fff;padding:0 30px 0 56px;text-align: center;position: absolute;top:50%;right: 2%;fbackground-size:21px;background: #f3b024 url(../img/icon_letter.svg) no-repeat 26px center;background-size:21px;}

/* 產品選單 */
aside {padding:10px!important;background-color:#fff;border-radius:6px;}
#button:focus:not(:focus-visible) {outline: 0;}
button:focus:not(:focus-visible):not(.swal2-styled):not(.swal2-confirm):not(.swal2-cancel) {
    outline: 0;
}
aside h3 {margin:0!important;color:#3a3a3a;}
aside .accordion-button:not(.collapsed) {background-color: transparent;color:#3a3a3a;box-shadow:none;}
aside .accordion-button:focus {color:#3a3a3a;}
aside .accordion-item {border:none;}
aside .accordion-body {padding-bottom:0}
aside .accordion-body ul {border-left:1px #e0e5eb solid;padding-left:16px;margin-left:12px}
aside .accordion-body a {display:block;font-size:.915rem;color:#3a3a3a;line-height:30px}
aside .accordion-body a:hover {text-decoration: underline !important;text-decoration-thickness: var(--cz-underline-thickness) !important;}

.goods-filters .row {background-color:#fff;padding:20px;border-radius:6px;}
.goods-list {margin:1rem 0 0;;}.goods-list .row {background-color:#fff;padding:20px;border-radius:6px;}
.goods-list .goods {padding-bottom:2rem;text-align: center;}.goods-list .goods img {max-width:100%;}.goods-list .goods a {font-size:.925rem;color:#3a3a3a;}
.goods-list .page-item.disabled a {background:#3a3a3a;color:#fff;}
.goods-pagination {margin-top:1.5rem;padding-top:1.5rem;border-top:1px #e0e5eb solid;}

/* 右側快選 */
.float_right_box {position: fixed;right:20px;bottom:208px;width: 80px;z-index: 9}
.float_right_box a {width: 72px;height: 72px;display: block;border-radius: 99px;text-align: center;margin:0 0 10px;border: #595757 1px solid;position: relative;-webkit-filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.7));filter: drop-shadow(2px 2px 3px rgba(0, 0, 0, 0.7))}
.float_right_box a:hover {border: #bc0d23 1px solid}
.float_right_box span {position: relative;display: inline-block;width:50px;color:#1a1a1a;-webkit-transform: translate(-50%);-ms-transform: translate(-50%);transform: translate(-50%);position: absolute;top:8px;left:50%;line-height: 1.65}
.float_right_box span::after {position: absolute;top:25px;left:8px;width:32px;height:1px;content: "";background: #bc0d23}
.float_right_box i {border-radius: 99px;}
.float_right_box a.map i {width: 72px;height: 72px;display: none;background: #bc0d23 url(../img/icon_map.svg) no-repeat center center;background-size: 52px;opacity: 0}
.float_right_box a.map:hover i {opacity: 1;display:block;}
.float_right_box a:hover span {opacity: 0}
.float_right_box a.order i {width: 72px;height: 72px;display: none;background: #bc0d23 url(../img/icon_order.svg) no-repeat center center;background-size: 32px;opacity: 0}
.float_right_box a.order:hover i {opacity: 1;display:block;}
.float_right_box a.forms i {width: 72px;height: 72px;display: none;background: #bc0d23 url(../img/icon_forms.svg) no-repeat center center;background-size: 42px;opacity: 0}
.float_right_box a.forms:hover i {opacity: 1;display:block;}

#loading {position:fixed;left:0;top:0;width:100%;height:100vh;z-index:999;text-align: center;}
#loading img {position: absolute;top: 40%;left: 50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);z-index: 999;display: inline-block;}
#content-wrapper {visibility:hidden;max-width: 1920px;margin: 0 auto;}
.filmbox {position: relative;height: calc(100vh - 95px);margin-bottom: 0;overflow: hidden;}
.filmbox video {position: absolute;top: 50%;display: block;left: 50%;z-index: 1;width: auto;min-width: 100%;min-height: 100vh;transform: translate(-50%, -50%);}

/* vision */
.vision {position: relative;vertical-align: middle;padding:0;text-align: right;overflow: hidden;height: 100vh;max-height:1030px;background: url(../img/main-vision.jpg) no-repeat center top;background-size: cover;}
.vision .imgbox {position:absolute;top:40%;left:50%;width: 100%;transform: translateX(-50%);text-align: center;}
.vision img {max-width: 748px;}
.vision .titlebox {position: absolute;bottom: 120px;left: 5%;color: #fff;z-index: 9;text-align:left;line-height: 1.28;}
.vision .titlebox p {font-size: 6.6vw;font-weight: bold;-webkit-filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.2));filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.2));font-family: 'Open Sans', sans-serif;}
.vision .subject {text-align: right;}
.vision .subject span {display: block;width: 100%;margin: 0 0 -1.5rem;letter-spacing: 5px;font-size: .825em;font-weight: 500;}
.vision .carousel-indicators {background: #fff;margin:0;padding: 32px 0;}
.vision .carousel-indicators li {border-radius: 99em;width: 16px;height: 16px;background: #d1d1d1;border:none;margin:0 5px;}
.vision .carousel-indicators li.active {background: #52c1e0}
.vision a.downbox {position: absolute;bottom: 96px;left: 50%;min-height:56px;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);color: #fff;z-index: 9;width: 426px;z-index: 9;background: url(../img/icon_down.svg) no-repeat center bottom;background-size: 11px;}
.vision .inner {position: absolute;top: 50%;left: 50%;-webkit-transform: translateX(-50%);-ms-transform: translateX(-50%);transform: translateX(-50%);color: #fff;z-index: 9;}
.vision .inner h1 {font: bold 3.75em/1 Inria Sans}
.vision  p.txt {position: absolute;right: 20px;top: 50%;width: 16px;font-size: small;color:#fff;z-index: 3;-webkit-writing-mode: vertical-rl;writing-mode: vertical-rl;transform: translateY(-50%);letter-spacing: 3px;font-family: 'Open Sans', sans-serif;text-align: left}

.banner {background: url(../img/banner.png) no-repeat center top;background-size: cover;min-height: 547px;}
.gray {background-color: #efefef;}

.title-box {text-align: center;}
.title-box span {font-size: 2.5em;font-family:font-family: 'Open Sans', sans-serif;font-weight: 200;color: #808080;}
.title-box h1 {font-size: 1.5em;margin: 0;letter-spacing: 5px;font-weight: 500;}

.EditBox {padding: 2rem 1em 5em;background: #fff;margin:2em 0;border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;box-shadow: 0px 5px 7px rgba(20, 20, 20, 0.1);border-top: 5px #e70e11 solid;}
.EditBox h1 {font-size: 1.5em;margin:0 0 16px;}
.EditBox p {word-break: break-all;margin: 0 0 1em;line-height: 1.8;color: #6a6a6a;}
.EditBox span.date {font-size: small;color: #868686;}
.EditBox img {max-width: 100%;margin:0 auto 1.25em;}
.EditBox .btnBox {margin:2em 0 0;text-align: center;}
.EditBox a.back {display: inline-block;width: 188px;background: #1d1d1f;color: #fff;text-align: center;border-radius: 99em;padding: 12px 36px;font-size: .825em;margin: 1em 0 0;}

#nav-tab {border:none;margin:0 0 66px;}
#nav-tab .nav-link {border-radius:0;text-align: center;background: #868994;line-height: 46px;color: #fff;border:none;margin: 0 .5px;}
#nav-tab .nav-link.active {background: #97bd12}
#nav-tab .owl-unit01 {margin:0;}

main {position: relative;top:0;padding:0;overflow: hidden;margin:0;font-size: 18px}
main .contentArea {max-width: 1440px;margin:0 auto;}
.titleBox {position: relative;font-size: 3.45em;padding:0 0 30px;margin:0 0 46px;letter-spacing: .03em;color: #4c4948;max-height: 104px}
.titleBox:after {position: absolute;left:0;bottom:0;content: "";background: #dd3324;width: 100%;height: 2px}
.topBox {margin: 0 0 2em;}
.topBox p.title {font-size: 4em;line-height: 1;margin-bottom: 0;color: #1d1d1f!important;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;letter-spacing: 2px;}
.topBox p.title:first-letter {color:#e70e11;}
.unit {margin: 2rem 0 5rem;}
.unit h2 {font-size: 4em;margin-bottom: 2rem;color: #1d1d1f;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;letter-spacing: 2px;}
.unit h2:first-letter {color:#e70e11;}
.unitA {text-align: center;}
.unitA .imgBox {border:1px #e6e6e6 solid;}
.unitA .txtBox {line-height: 30px;margin:8px 0 0;}
.unitA .txtBox p {display: inline-block;color: #5a5a5a;letter-spacing: .05vw;text-align: center;}
.unitA .txtBox i {display: inline-block;width: 21px;height: 21px;background: url(../img/arrow02.png) no-repeat center;vertical-align: middle;margin: -1px 0 0 10px;}
.unitA .imgbox {padding-top: 28%;}
.unitA .imgbox img {max-width: 100%;width: 100%;}
.unitB {position: relative;text-align: center;background: #efefef url(../img/unitB-top.png) no-repeat left top;}
.unitB h2 {text-align: left;}
.unitB ul.list {max-width: 855px;text-align: left;}
.unitB ul.list li {border-bottom: 1px #e6e6e6 solid;padding: 1rem 0}
.unitB ul.list a {color: #1d1d1f;font-size: .925em;}
.unitB ul.list span.date {display: inline-block;color: #e70e11;font-size: small;width: 80px;}
.unitB ul.list p {width: calc(100% - 80px;);display: inline-block;margin: 0}
.unitB ul.list i {background: url(../img/arrow02.png) no-repeat center;display: inline-block;width: 21px;height: 21px;vertical-align:middle;margin-left: 10px;}
.unitB .btnbox {max-width: 855px;text-align: right;}
.unitB a.more-btn {display: inline-block;background: #1d1d1f url(../img/arrow01.png) no-repeat 90% center;padding: 1rem 4.8rem 1rem 3.8rem;color: #fff;font-size: .825em;margin: 2.8rem 0 0;}
.unitB a.more-btn:hover {background: #1d1d1f url(../img/arrow01.png) no-repeat 95% center;}
.unitB .bottombox {height: 70px;background: #efefef url(../img/unitB-bottom.png) no-repeat right bottom;margin-top: 3rem;}
.unitC {text-align: center;}
.unitC .mapbox {min-height: 360px;margin:0 0 5rem;-webkit-filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.2));filter: drop-shadow(1px 1px 3px rgba(0, 0, 0, 0.2));}
.unitC .mapbox iframe {width: 100%;min-height: 360px;}
.unitC h3 {font-weight: 600;margin: 0 0 .5em;font-size: 1.25em;}
.unitC p {color: #808080;margin: 0 0 1.2em;}
.unitC a i {display: inline-block;background: url(../img/icon-tel.png) no-repeat center;border-radius: 99px;border:1px #606060 solid;width: 36px;height: 36px;}
.unitC a {color: #606060;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;font-size: 2rem;line-height: 1;}
.unitC a span {display: block;}

/*about*/
#about {padding: 3em 0;background: #efefef;}
#about .unitBox1 {position: relative;background: #fff;min-height: 760px;margin:0 0 2em;}
#about .unitBox1:before {position: absolute;top:0;left:0;content: '';width: 100%;height: 318px;background: url(../img/top-bg-g.png) no-repeat center bottom;}
#about .unitBox1:after {position: absolute;bottom:0;left:0;content: '';width: 100%;height: 318px;background: url(../img/down-bg-g.png) no-repeat center bottom;}
#about .unitBox1 p {color: #6b6b6b;line-height: 1.8;letter-spacing: 2px;text-align: justify; text-justify:inter-ideograph;}
#about h2 {font-size: 4em;margin-bottom: 0;color: #1d1d1f;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;letter-spacing: 2px;}
#about h2:first-letter {color:#e70e11;}
#about h3 {font-size: 1.5em;font-weight: 600;margin:0 0 1em;}
#about .imgBox {position: absolute;left: 0;padding: 0;}
#about .unit01 {position: relative;padding: 13em 15px 0;z-index: 2;}
#about .EditBox {max-width: 800px;margin: 0 auto;}
#about .EditBox p {line-height: 1.8;}
#about .unitBox2 {position: relative;background: #efefef;text-align: center;padding: 0 0 5em;}
#about .unitBox2 .logoBox {border:1px #868686 solid;background: #f3f3f3;margin:0 0 2em;}
#about .unitBox2 .logoBox > div {padding: 0;}
#about .unitBox2 .Rbox {background: #343434;}
#about .unitBox3 {position: relative;background: #efefef;text-align: center;padding: 0 0 5em;}
#about .unitBox3 a p {color: #6a6a6a;margin: 1em 0 0;display: block;}

/*product*/
#product {padding: 3em 0;background: #efefef;}
#product h1 {color: #1d1d1f;font-weight: 600;font-size: 1.75em;margin:0 0 .5rem;}
#product h2 {font-size: 1.75em;margin: 0 0 10px;color: #1d1d1f;font-weight: 500;font-family: Microsoft JhengHei, Bebas Neue, cursive;letter-spacing: 2px;}
#product h3 {color: #1d1d1f;font-weight: 600;font-size: 1.35em;margin:0 0 .5rem;}
#product .listBox {position: relative;padding: 0 0 2em;margin:0 0 5em;}
#product .listBox:before {position: absolute;content: '';bottom:0;left:50%;width: 1140px;height: 2px;background: #1d1d1f;transform: translateX(-50%);}
#product .imgBox {padding: 0}
#product .imgBox img {max-width: 100%;width: 100%;}
#product .txtBox {color: #8a8a8a;padding: 0 0 0 3em;}
#product .txtBox p {margin:0 0 1rem;font-size: .9em;}
#product a.more {display: inline-block;background: #1d1d1f;color: #fff;text-align: center;border-radius: 99em;padding: 8px 36px;font-size: .825em;margin: 1em 0 0;}
#product .caseBox {display: flex;margin: 3em -15px 0;padding: 0;}
#product .caseBox img {max-width: 100%;width: 100%;}

/*product_detail */
#product_detail h1 {color: #1d1d1f;font-weight: 600;font-size: 1.75em;margin:0 0 .5rem;}
#product_detail {padding: 3em 0;background: #efefef;}
#product_detail h2 {font-size: 1.75em;margin: 0 0 10px;color: #1d1d1f;font-weight: 500;font-family: Microsoft JhengHei, Bebas Neue, cursive;letter-spacing: 2px;}
#product_detail h3 {color: #1d1d1f;font-weight: 600;font-size: 1.35em;margin:0 0 1.5rem;}
#product_detail .listBox {position: relative;padding: 0 0 2em;margin:0 0 3em;}
#product_detail .imgBox {padding: 0}
#product_detail .imgBox img {max-width: 100%;width: 100%;}
#product_detail .txtBox {color: #8a8a8a;padding: 0 0 0 3em;}
#product_detail .txtBox p {margin:0 0 1rem;font-size: .9em;}
#product_detail h2 {font-size: 1.75em;margin: 0 0 10px;color: #1d1d1f;font-weight: 500;font-family: Microsoft JhengHei, Bebas Neue, cursive;letter-spacing: 2px;}
#product_detail .caseBox {display: flex;margin: 3em -15px 0;padding: 0;}
#product_detail .caseBox img {max-width: 100%;width: 100%;}
#product_detail .detailBox {background: #fff;border-top: 2px #8a8a8a solid;min-height: 600px;padding: 3em 1.5em;border-bottom-right-radius: 10px;border-bottom-left-radius: 10px;box-shadow: 0px 5px 7px rgba(20, 20, 20, 0.1);}
#product_detail .detailBox h4 {font-weight: 600;color: #1d1d1f;font-size: 1.15em;margin:0 0 1em;}
#product_detail .specs-list {margin:0 0 3.6em;}
#product_detail .ImgMan img {max-width: 100%;width: 100%;}
#product_detail .goods_info ul li {border-bottom: 1px #efefef solid;line-height: 50px;}
#product_detail .goods_specs h4 {padding: 15px 0 0;}
#product_detail .goods_specs dl {margin: 0;}
#product_detail .goods_specs dt, #product_detail .goods_specs dd {display: inline-block;font-size: .925em;padding: 15px 0;float:left;margin: 0;}
#product_detail .goods_specs dt {width: 188px;border-bottom: 1px #4d4d4d solid;}
#product_detail .goods_specs dd {border-bottom: 1px #e6e6e6 solid;width: calc(100% - 208px);padding-left: 20px;}
#product_detail .goods_download p {display: block;border-bottom: 1px #efefef solid;padding: 0 0 10px;}
#product_detail .goods_download a {display: inline-block;padding: 5px 36px 5px 0;color: #1d1d1f;background: url(../img/icon-pdf.png) no-repeat right center;}

/*video*/
#video {padding: 3em 0;}
#video h2 {font-size: 4em;margin: 0;color: #1d1d1f;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;letter-spacing: 2px;}
#video h2:first-letter {color:#e70e11;}
#video .videoBox {width: 1140px;}
.video-container {position: relative;padding-bottom: 56.25%;padding-top: 30px;margin: 0 0 35px;height: 0;overflow: hidden;}
.video-container iframe, .video-container object, .video-container embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}

/*news*/
#news {padding: 3em 0;background: #efefef;}
#news .txtBox h3 {font-weight: 600;margin:0 0 5px;}
#news .txtBox p {color: #6a6a6a;margin:0 0 2em;}
#news ul.tab a {display: block;background: #fff;color: #1d1d1f;font-size: .9em;font-family: 'Bebas Neue', cursive;padding: 8px 36px;}
#news ul.tab a:hover {background: #1d1d1f;color: #fff;}
#news ul.tab a.active {background: #1d1d1f;color: #fff;}
#news ul.tab li {display: inline-block;margin-right: 5px;}
#news .funcBox select {background: #fff;border: none;font-family: 'Bebas Neue', cursive;color: #1d1d1f;font-size: .9em;padding: 8px;min-width: 188px;}
#news ul.list {margin: 3em 0 0;}
#news ul.list li {padding: 0 0 2em;margin: 0 0 3em;border-bottom: 1px #8a8a8a dashed;}
#news ul.list a {color: #313131;}125em;}
#news ul.list p {margin: 0 0 1.5em;color: #5a5a5a;}
#news ul.list a {display: flex;}
#news ul.list .imgBox, #news ul.list .txtBox {display: inline-block;}
#news ul.list .imgBox {flex: 0 0 25%;max-width: 25%;}
#news ul.list .imgBox img {max-width: 100%;}
#news ul.list .txtBox {flex: 0 0 75%;max-width: 75%;padding-left: 3em;}
#news ul.list .txtBox span.more {display: inline-block;background: #1d1d1f;color: #fff;border-radius: 99em;font-family: 'Bebas Neue', cursive;font-size: .9em;line-height: 40px;min-width: 188px;text-align: center;letter-spacing: 2px;}

/*contact*/
#contact {padding: 3em 0;background: #efefef;}
#contact h2 {font-size: 4em;margin: 0;color: #1d1d1f;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;letter-spacing: 2px;}
#contact h2:first-letter {color:#e70e11;}
#contact textarea.form-control {height: 242px;}
#contact .form-control {height: 50px;border:none;border-radius: 0;margin: 0 0 5px;}
#contact .btnBox {text-align: right;}
#contact .send {background: #1d1d1f;color: #fff;line-height: 50px;width: 188px;border-radius: 0;padding: 0;}
#contact .contentArea {text-align: center;margin: 3em 0 0;}
#contact .mapbox {position: relative;height: 380px;margin:0 0 2rem;;padding: 10px;background: #fff;}
#contact .mapbox:after {position: absolute;content: '';bottom:0;right: 0;width: 100%;height:100%;background: url(../img/map-down-bg.gif) no-repeat right bottom;z-index: 0}
#contact .mapbox:before {position: absolute;content: '';top:0;left: 0;width: 100%;height:100%;background: url(../img/map-top-bg.gif) no-repeat;z-index: 0}
#contact .mapbox iframe {position: relative;width: 100%;height: 360px;z-index: 1}
#contact h3 {font-weight: 600;}
#contact p {color: #808080;}
#contact a i {display: inline-block;background: url(../img/icon-tel.png) no-repeat center;border-radius: 99px;border:1px #606060 solid;width: 36px;height: 36px;}
#contact a {color: #606060;font-weight: 500;font-family: 'Bebas Neue', cursive, Microsoft JhengHei;font-size: 2rem;line-height: 1;}
#contact a span {display: block;}
#contact label {font-weight: 600;color: #1d1d1f;}
#contact input::placeholder, #contact .form-control {color: #808080!important;}

/*輪播*/
.owl-nav {display: none;}
.owl-carousel .owl-dots.disabled {display: block;}
.owl-dots button {display: inline-block;margin:0 5px;}
.owl-dots button.active span {background: #1d1d1f;}
.owl-dots span {display: block;width: 24px;height: 8px;background: #efefef;border-radius: 10px;}

/*for ie10 、 ie11*/
@media screen and (-ms-high-contrast: active),(-ms-high-contrast: none){
#filebox a span {background-size: 50px;}
}

.open {position: relative;display: block;}
span.down {cursor: pointer;position: absolute;right:0;top:0;color: #c00d23;padding-right: 50px;font-size: 1.5em;display: inline-block;line-height: 2.2em}
span.down::after {position: absolute;right:0;top:0;width: 50px;height: 59px;background: url(../img/icon_down.svg) no-repeat 90% center;background-size: 30px;content: ""}
#unitbox {display: block;margin: 0 0 60px;display: none}

/* sideNav */
#sideNav {width: 345px;float: left;}
#sideNav ul a {color: #074f77;font-size: 1.125em;padding:10px 0;display: block;font-weight: bold;}
#sideNav ul li ul a {color: #1a81d6;padding-left: 15px;position: relative;font-size: .925em}
#sideNav ul li ul a:before {position: absolute;content:'';width: 5px;height: 3px;background: #1a81d6;top:50%;left:0;}
#sideNav ul li ul a:hover:before {background: #db0068;color:#db0068}
#sideNav ul li ul a:hover, #sideNav ul li ul a.active {color:#db0068}
#sideNav ul li ul a.active:before {position: absolute;content:'';width: 5px;height: 3px;background: #db0068;top:50%;left:0;}

/*單元分類*/
ul.itembox  {text-align:center}
ul.itembox li {position: relative;display: inline-block;margin: 0 -2px}
ul.itembox li::before {position: absolute;top:0;left: 0;content:"";width: 1px;height: 1em;background-color: #e5e5e5}
ul.itembox li:last-child::after{position: absolute;top:0;right: 0;content:"";width: 1px;height: 1em;background-color: #e5e5e5}
ul.itembox a {font-size:1em;color: #3a3a3a;padding: 0 20px}
ul.itembox a:hover {color: #d7aa38}
ul.itembox a.active {color: #d7aa38}

/* 麵包屑 */

/* footer */
footer {position:relative;letter-spacing: .05vw;background: #1d1d1f url(../img/f-bottom.png) no-repeat right top;padding:98px 0 0;color: #606060;}
footer.gray {background: #1d1d1f url(../img/f-bottom-g.png) no-repeat right top;}
footer > div {padding: 0!important;}
footer .inner {margin: 0 auto;max-width: 1440px;}
footer .toparea {position: relative;z-index: 2;padding-bottom: 92px;}
footer .toparea .adr {color: #606060;font-size: small;margin: 5px 0 0;}
footer .toparea .linkbox {text-align: right;line-height: 36px;}
footer .toparea .linkbox a {margin-left: 12px;display: inline-block;}
footer .toparea .linkbox img {vertical-align: text-top;}
footer .toparea a.tel {background: url(../img/icon-tel.png) no-repeat left center;padding-left: 26px;display: inline-block;color: #606060;font-family: 'Bebas Neue', cursive;font-size: 1.5em;}
footer ul {display: block;width: 100%;text-align: right;}
footer ul li {display: inline-block;margin-right: 1.8rem;flex: 1;}
footer ul li:last-child {margin-right:0;}
footer ul a {color: #606060;padding: 0 0 15px;display: block;width: 100%;font-family: Microsoft JhengHei, 'Bebas Neue', cursive;font-size: 18px;}
footer ul a:hover {color: #fff;opacity: .8}
footer ul.info {margin: 0 0 1rem;}
footer ul.info li {display: inline-block;margin-right: 5px;flex: 1;position: relative;color: #fff;}
footer ul.info span {position: relative;padding-right: 20px;}
footer ul.info span:before {position: absolute;top:3px;right:0;content: '';width:10px;height:10px;background: linear-gradient(135deg, transparent 49.5%, #fde29a 49.5%, transparent 50.5%, transparent 50.5%);box-sizing:border-box;}
footer .bottomarea {position: relative;z-index: 1;display: block;line-height: 54px;}
footer .bottomarea p {display:inline-block;margin:0 0 0 1em;font-size: .825em;}
footer .bottomarea .leftbox img {vertical-align:middle;max-width: 222px;margin-right: 2.6rem}
footer .bottomarea .leftbox .txtbox {position: relative;display: inline-block;padding: 20px 0 0 20px;margin-left: 20px;}
footer .bottomarea .leftbox .txtbox:before {position: absolute;left:0;top:25px;width:1px;height:40px;content: "";background: #de0012}
footer .bottomarea .rightbox {text-align: right;}
footer .bottomarea .rightbox a {color: #6a6a6a;}
footer .bottomarea .rightbox i {color: #6a6a6a;font-size: 1.25em;vertical-align: middle;padding: 0 .5rem;}
footer .topbox {position: relative;text-align: center;height: 58px;z-index: 5;
background: linear-gradient(360deg, rgba(252, 207, 3, 1)0%, rgba(231, 14, 17, 1)100%);
background: -moz-linear-gradient(360deg, rgba(252, 207, 3, 1)0%, rgba(231, 14, 17, 1)100%);
background: -webkit-linear-gradient(360deg, rgba(252, 207, 3, 1)0%, rgba(231, 14, 17, 1)100%);
background: -o-linear-gradient(360deg, rgba(252, 207, 3, 1)0%, rgba(231, 14, 17, 1)100%);
}
footer .topbox a{width: 100%;display: inline-block;background: url(../img/arrow-top.png) no-repeat center 10px;padding-top: 30px;color: #fff;font-size: small;}
.clearfix {width: 100%;}
.clearfix:after {content: "";display: block;clear: both;}

/* 置頂 */
#toTop {display: none;text-decoration: none;position: fixed;bottom: 128px;right: 30px;overflow: hidden;width: 72px;height: 72px;border: none;text-indent: 100%;background: url(../img/arrow_top.svg) no-repeat center center;z-index:9;border-radius: 99px;}
#toTopHover {background: url(../img/arrow_top.svg) no-repeat center center;width: 72px;height: 72px;display: block;overflow: hidden;float: left;opacity: 0;-moz-opacity: 0;filter: alpha(opacity=0);}
#toTop:active, #toTop:focus {outline:none;}

/* 單元選單 */
#nav_menu {width: 100%}
#nav_menu a.item {display: none;}

/* 分頁 */
.pagebox {width: 100%;}
.navigation {width: 100%;}
.pagination {justify-content:center!important;}
.page-link, .page-link:hover {color: #6a6a6a;}
.page-link:hover {background: #efefef;}
.page-item.active .page-link {background: #1d1d1f;border-color: #1d1d1f;}

@media only screen and (max-width: 1399px) {
img.pc {display:none!important;}
img.sp {display:block!important;}
header {background-size: 100% 20px;}
header > div {background: #fff;height: 72px}
.navbar {display:block}
.logo, .unit-menu, header .search-container {display:none}
#nav_menu a.item {position: relative;margin: 0 15px 20px;background:#52c1e0;display: block;line-height: 50px;color: #fff;text-align: center;border-radius: 6px;}
#nav_menu .fa-angle-down {display: block;font-size: 15px;position: absolute;right: 10px;top: 50%;margin-top: -6px;}
#nav_menu .fa-angle-down:before {content: "\f107";}
#nav_menu .undefinedOver .fa-angle-down:before {content: "\f106";}
header {position:fixed;top:0;left:0;width: 100%;padding:0;z-index: 99;transform: inherit;}
header .container {padding:0;display: none;}
header .home {display:block;width: 100%!important;}
header.index {height: auto;}
header .contact, header .order, header .booking-line, .navbar-toggle {display:block;}
header.page {height: auto;}
header .sp {position: inherit;}
header .search-container {height: 40px;width: 100%;display: block;margin:10px 0 0;}
header .search-container button, header .search-container input[type=text] {padding: 12px 10px;}
#menubox {display: none;height: 50px}
.navbar {margin-bottom:0;border:none}
.navbar-brand {position:fixed;top:0;left:0}
.navbar-inverse, .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover {background-color:transparent!important;}
.navbar-toggle {position: relative;border:0;border-radius:0;z-index:99;margin:0;}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {position: fixed;top: 0;left:0;width:100%;border:none;box-shadow:none;z-index:7;}
.navbar-collapse {margin:0!important;padding:0!important;}
.navbar-nav {padding:20px;margin:6em 0 2.8rem;text-align:center;text-align: left;}
.navbar-inverse .navbar-nav>li {float:left;width:100%;padding:8px 1em;border-bottom: 1px solid #ececec;}
.navbar-inverse .navbar-nav>li>a {display:block;padding:0;font-size:1.88ex;color:#1a1a1a;letter-spacing: .1em;}
.navbar-inverse .navbar-nav>li span {display:block;width:100%;font-size:16px;color:#1a1a1a;letter-spacing: 1.65px;position: relative;}
.navbar-inverse .navbar-nav>li .item span::after {position: absolute;right: 0;content: '+';color:#434343;}
/*.navbar-inverse .navbar-nav>li .undefinedOver span::after {position: absolute;right: 0;content: '-';color: #1a1a1a;}
.navbar-inverse .navbar-nav>li ul {margin: 18px 0 0;display: none;}
.navbar-inverse .navbar-nav>li ul a {position:relative;font-size: 1em;color: #6a6a6a;line-height: 40px;display: block;padding-left: 2em;}

.navbar-inverse .navbar-nav>li ul ul {margin: 5px 0;position: fixed;background: #fff;z-index: 9999;width: 100%;top: -5px;left: 0;height: 100%;padding: 88px 0 0;}

.navbar-inverse .navbar-nav>li ul a:after {position: absolute;right: 0;top: 0;width: 16px;height: 10px;}
.navbar-inverse .navbar-nav>li ul a

.navbar-inverse .navbar-nav>li ul ul a {position: relative;padding-left: 32px;font-weight: 500;}
.navbar-inverse .item2:after, .navbar-inverse .item2:before {
	content:'';
    position: absolute;
    top: 50%;
    right: 0px!important;
    margin-top: -1px;
    display: inline-block;
    height: 2px!important;
    width: 10px!important;
    background: #000;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform-origin: 9px 50%;
    -moz-transform-origin: 9px 50%;
    -ms-transform-origin: 9px 50%;
    -o-transform-origin: 9px 50%;
    transform-origin: 9px 50%;}
.navbar-inverse .item2:before {
	top:24px!important;
	-webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}
.navbar-inverse .item2:after {
	top:24px!important;
	-webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


.navbar-top {display:none;}
.navbar-toggle .icon-bar {width: 27px;height: 1px;}
.navbar-toggle .icon-bar+.icon-bar {margin-top:8px;}
.navbar-inverse .navbar-nav, .navbar-inverse .navbar-nav>li {background:none}


.dropdown-content {border-top: 1px #efefef solid;}
.dropdown-content li {border-bottom: 1px #efefef solid;}*/
/*.go-back {position: relative;transition: opacity 0.3s, transform 0.3s;font-weight: 500!important;color: #131313!important;font-size: 20px!important;padding-left: 30px!important;}
.go-back::before, .go-back::after{
	content:'';
    position: absolute;
    top: 50%;
    left: 10px;
    margin-top: -1px;
    display: inline-block;
    height: 2px!important;
    width: 10px!important;
    background: #000;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;}
.go-back::before {
	top: 24px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);}
.go-back::after {
	top: 18px!important;
	-webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);}*/
.language {background: transparent;line-height: revert-layer;}
.navbar-brand {position:relative;}
.navbar-inverse {background-color:#fff!important;padding:10px 0}
.brand-logo {padding: 0}
.brand-logo img {width:auto;height:48px}
.brandBox {position: relative;top:5em;left:30px;}
.social {top:0;left:0}
.telbox {width:100%;text-align:center;margin: 20px 0 0}
.telbox span {position: relative;display:block;width:158px;margin:0 auto 12px;color:#fff;letter-spacing: 1.65px}
.telbox span:before {content: " ";position: absolute;bottom: 8px;left: 0;margin-left:0;width: 26px;height: 1px;background-color: #fff;}
.telbox span:after {content: " ";position: absolute;bottom: 8px;right: 0;margin-right:0;width: 26px;height: 1px;background-color: #fff;}
.telbox a {display:block;color:#f4df3a;font-size:28px}

#progress {margin:2rem 0 0;}
#progress .content {padding: 0 15px!important;}
#progress .imgWrap .inner {width:100%;	padding: 5rem 15px;min-height: inherit;}
#progress .imgWrap .inner h2 {font-size: 1em!important;}
#progress .bottomarea {display: none;}

.overlay {position: fixed;background: #fff;top: 0;left: 0;width: 100%;height: 0%;opacity: 0;visibility: hidden;-webkit-transition: opacity .35s, visibility .35s, height .35s;transition: opacity .35s, visibility .35s, height .35s;  overflow: hidden;z-index:5;border: 10px #959595 solid;}
.overlay.open {opacity: 1;visibility: visible;height:100%}
.button_container {position:fixed;top:20px;right:15px;height: 28px;width: 40px;cursor: pointer;z-index: 100;-webkit-transition: opacity .25s ease;transition: opacity .25s ease;z-index:8;background: transparent;}
.button_container:hover {opacity: .7;}
.button_container.active .top {
  -webkit-transform: translateY(12px) translateX(0) rotate(45deg);
          transform: translateY(12px) translateX(0) rotate(45deg);
  background: #1d1d1f;
}
.button_container.active .middle {opacity: 0;background: #FFF;}
.button_container.active .bottom {
  -webkit-transform: translateY(-12px) translateX(0) rotate(-45deg);
          transform: translateY(-12px) translateX(0) rotate(-45deg);
  background: #1d1d1f;
}
.button_container span {background: #1d1d1f;border: none;height: 2px;border-radius: 20px;width: 100%;position: absolute;top: 0;left: 0;-webkit-transition: all .35s ease;transition: all .35s ease;cursor: pointer;}
.button_container span:nth-of-type(2) {top: 12px;}
.button_container span:nth-of-type(3) {top: 24px;}
}

/* 平板 */
@media (min-width: 769px) and (max-width: 1023px) {

}

@media only screen and (max-width: 768px) {
body {overflow-x: hidden;}
a:focus, button {display:block}
*:focus {outline: none;}
.sp {display: block!important;}
.brand-logo {padding: 0;position:relative!important;width:40%}
.brand-logo img {width:auto;height:48px}
header {padding:10px 15px;height:68px;background:#fff}
header .infobox {text-align: center;}
header .infobox span {display: inline-block;vertical-align: middle;}
header .infobox .tel {font-size: 1.6em;font-weight: 600;margin: 0 0 .5rem;}
header .link {padding: 0 20px;text-align: center;}
header .link a {color: #216d36;font-size: 1.68em;margin:0 .5rem;}
header .language {text-align: center;}
header .language a {display: block;float: left;margin-right: 15px;}
header .language a.active {color: #e70e11;}
.container {max-width: 100%}
h2 {font-size: 1.75em!important}
h3 {font-size: 1.25em!important}
img {max-width: 100%}

.float_right_box {display: none;}

/* 首頁設定 */
.unitBox {padding: 10px}
.unitA p {max-width: 100%;}
.unitA .imgbox {padding-top: 20%;}
.unitA .txtBox p {font-size: small;line-height: 1;}
.unitB {background-size: 100%;}
.unitB h2 {text-align: center;}
.unitB .imgbox {width: 100%;}
.unitB .txtbox {position: static;width: 80%;margin: 0 auto;padding:20px;text-align: center;}
.unitB .txtbox p {font-size: .8em;}
.unitB .txtbox span {padding-right: 8px;margin-right: 8px;}
.unitB .txtbox a.info {float:none;margin: 0 auto;}
.unitB .btnbox {text-align: center;}
a.more-btn {margin:0 auto;}

main {padding: 0 0 50px;top: 68px;}
main .contentArea {padding: 0 10px;}
main .contentArea .row {margin: 0;}
.unitarea .shadowbox {background-size: contain;}

/* 單元 */
.topBox p.title {font-size: 2em;}
.vision {height: 240px;}
.banner {min-height: 160px;background-size: cover;}
#about {padding: 20px 0;}
#about .unit01 {padding: 18em 15px 0;}
#about h3 {margin: 0 0 18px;}
#about .unitBox1:after {background-size: contain;}
.owl-dots span {width: 16px;height: 4px;}
#news ul.list a {display: block;}
#news ul.list .imgBox, #news ul.list .txtBox {display: block;flex: 0 0 100%;max-width: 100%;}
#news ul.list .imgBox img {width: 100%;}
#news ul.list .txtBox {padding: 2em 0 0;}
#news ul.list .txtBox span.more {min-width: 100%;}
#product .txtBox, #product_detail .txtBox {padding: 20px 0 0;}
#product_detail h3 {text-align: center;}
#product_detail .detailBox {padding: 2em 1em;}
#product_detail .detailBox h4 {font-size: 1em;}
#product_detail .specs-data {overflow-x: scroll;}
#product_detail .specs-list dl {position: relative;min-width: 800px;}
#video .videoBox {width: 100%;}
#video .row {display: flex!important;}
.goods-filters {margin:10px 0 0;padding:0;}
.goods-filters .row>div {margin:0 0 5px;}
.goods-list {padding:0;}

footer {padding: 60px 0 0;margin:0;}
footer .inner {width: 100%;max-width: 100%;text-align: center;padding: 20px 0;}
footer .toparea {padding:0;}
footer .toparea .f-logo {height: 60px;width: auto;}
footer .toparea .linkbox {text-align: center;}
footer ul {margin: 0;text-align: center;}
footer ul li {margin-right: 10px;}
footer .row {display: block}
footer .bottomarea, footer .bottomarea .rightbox {line-height: 1.5;text-align: center;}
footer .bottomarea {padding: 10px 0;}
footer .bottomarea .inner > div {width: 100%;padding: 0}
footer .bottomarea p {margin:0;font-size: 10px;}

a.top {padding: 5em 0 0}
a.top:before {height: 4em}

#toTop {width: 50px;height: 50px;bottom: 60px;opacity: .9}
#mobileMenu {height:100vh;max-width:100vw;overflow-y:auto}
.btn-Menu {top:10px;right:15px;width:50px;line-height:50px;text-align:center;color:#333;font-size:13px;}
.offcanvas-header {justify-content: end;}
.mobileMenu {text-align:center;padding:3rem 0 0;}
.mobileMenu li {border-bottom: 1px solid #ececec;text-align:left;}
.mobileMenu a {display:block;font-size:1rem;color:#131313;padding:10px 15px;}
.mobileMenu li.language a {display:inline-block;}
.mobileMenu li.language a:first-child {}
.offcanvas-body .infobox {text-align: center;margin:3rem 0 0;}
.offcanvas-body .infobox span {display: inline-block;vertical-align: middle;}
.offcanvas-body .infobox .tel {font-size: 1.6em;font-weight: 600;margin: 0 0 .5rem;}
.offcanvas-body .accordion-item {border:none;}
.offcanvas-body .accordion-button:not(.collapsed) {background-color:#fff;box-shadow:none;}
.offcanvas-body .accordion-item li {border:none;}
.offcanvas-body .accordion-item .accordion-button {padding:10px 15px;}
}