@import url('/css/SeoJump.css');
@import url('https://fonts.googleapis.com/css?family=Oswald');

* { -webkit-text-size-adjust: none; }

body {margin: 0;width: 100%;background-image: url(/images/22/dots.png);border: 0;font-size: 16px;line-height: 150%;color: #000;}

div , h1 , h2 , h3 , h4 , hr , p , form , label , input , textarea , img , span , strong { margin: 0; padding: 0; border-width: 0; text-align: left; font-family: "微軟正黑體","蘋果儷中黑","Lucida Grande","Arial","Arial Narrow"; word-wrap: normal; word-break: normal; outline: none; vertical-align: middle; }

hr { noshade: noshade; }
th { font-weight: 400; }

ul , ol { overflow: hidden; margin: 0; padding: 0; list-style: none; }
li { list-style: none; }

a , a:hover { text-decoration: none; cursor: pointer; outline: none; color: #000; }

img { max-width: 100%; }

br { font-family: Arial!important; }

.pageh1 { position: fixed; color: #fff; z-index: -8989898; opacity: 0; }

.wrapper .slick-slider { margin: 0; }
.wrapper { overflow: hidden; position: relative; }

.mobile-main-nav , .nav-func , .subnav , .sub2nav , .sub3nav ,  .sub2Option , .sub3Option , #mobile-menu { display: none; }
.phoneWrap{display: none !important;}

/* header */
header {position: fixed;padding: 20px 30px;width: calc(100% - 60px);top: 0;left: 0;z-index: 99;transition: all linear .2s;background: rgba(255 , 255 , 255 , .9);display: flex;}
header.headerTop{background:#0b346e;}
header.headerTop #menubar #main-menu >ul >li >a, header.headerTop #topContact p, header.headerTop #topContact p a, header.headerTop #topContact img{color:#fff;-webkit-filter: contrast(0) brightness(150%);filter: contrast(0) brightness(200%);}
header #cis a { background: no-repeat 0 50% / contain; display: block; }
header #cis a img { width: 100%; }
header #menubar {float: left;width: calc(100% - 530px);transition: all linear .3s;margin-left: 70px;display: flex;}
header:after{content:'';position:absolute;width: 360px;height: 100%;background: #0B346E;left: 0;top: 0;z-index: 0;}
header #cis {float: left;width: 300px;z-index: 2;position: relative;}
header #topContact , header #Wlanguage {margin: 2px 0;display: flex;}
header #topContact img{
    float: left;
    width: 29px;
    margin: 8px 0;
}
header #topContact p{
    float: right;
    margin-top: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: calc(100% - 35px);
    text-align: left;
    font-size: 15px;
}
header #topContact p a{
    display: block;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}
header #topContact .top-order-phone {    overflow: hidden;}
header #translate { margin: 0 15px; float: right; }
header #topContact h3 , header #translate h3 , header #Wlanguage h3 { margin-top: 25px; }
header #topContact h3 a , header #translate h3 b , header #Wlanguage h3 a { padding-top: 40px; min-width: 50px; background: url(/images/22/header_options_contact.png) no-repeat 50% 0 / auto 30px; display: block; opacity: .8; text-align: center; font-family: 'Oswald',sans-serif; font-weight: 400; font-size: 15px; color: #fff; cursor: pointer; transition: all linear .2s; }
header #topContact h3 a b { font-weight: 400; }
header #translate h3 b { background-image: url(/images/22/header_options_search.png); }
header #Wlanguage h3 a { background-image: url(/images/22/header_options_translate.png); }

#translate >p { margin-left: 10px; display: inline-block; font-size: 12px; color: #238dc7; vertical-align: initial; }
#translate >p a { color: #1b6c98; }
#translate form { position: fixed; background-color: #000; display: block; text-align: center; line-height: 40px; color: #fff; top: 132px; right: 50px; z-index: 8; }
#translate form p { overflow: hidden; background: #fff; border: 1px solid #7d7d7d; }
#translate #goSearch { padding: 5px 10px; float: right; height: 25px; background: #848484; text-align: center; line-height: 20px; font-size: 12px; letter-spacing: .1em; line-height: 25px; color: #fff; }
#translate form input { margin-top:4px; padding: 0 5px; float: left; height: 25px; width: 120px; display: inline-block; font-size: 14px; }

/* menubar */
#menubar #main-menu ul {overflow: visible;text-align: left;}
#menubar #main-menu >ul >li { position: relative; margin-left: -4px; display: inline-block; vertical-align: top; }
#menubar #main-menu >ul >li >a {position: relative;padding: 0 10px;margin: 0 20px;height: 52px;display: table;font-size: 16px;color: #333;transition: all linear .3s;font-weight: bold;letter-spacing: 2px;}
#menubar #main-menu >ul >li >a p { display: table-cell; text-align: center; line-height: 120%; vertical-align: middle; }
#menubar #main-menu >ul >li >a p:after{content:'';position:absolute;width: 100%;height: 4px;background: #0B346E;left: 0;bottom: -20px;transform: scale(0,1);transform-origin: center 0;transition: transform 1s cubic-bezier(0.23,1,0.32,1);}
#menubar #main-menu >ul >li:hover >a p:after{transform: scale(1,1);transform-origin: center 0;}
#menubar #main-menu >ul >li >a b { margin-bottom: 5px; display: block; text-align: center; font-family: 'Oswald',sans-serif; line-height: 100%; font-weight: 400; }
#menubar #main-menu ul.subnav { position: absolute; width: 200px; box-shadow: 0 0 20px #dedede; display: none; text-align: left; left: calc(50% - 100px); z-index: 5; top: 100%; }
#menubar #main-menu >ul >li:active ul.subnav , #menubar #main-menu ul.subnav li:active ul.subOption { display: block; }
#menubar #main-menu ul.subnav li { position: relative; background: #fff; }
#menubar #main-menu ul.sub2nav , #menubar #main-menu ul.sub3nav { position: absolute; width: 100%; box-shadow: 0 0 20px #dedede; display: none; text-align: left; top: 0; left: 100%; z-index: 54; }
#menubar #main-menu >ul >li:last-child ul.sub2nav , #menubar #main-menu >ul >li:last-child ul.sub3nav , #menubar #main-menu >ul >li:nth-last-child(2) ul.sub2nav , #menubar #main-menu >ul >li:nth-last-child(2) ul.sub3nav , #menubar #main-menu >ul >li:nth-last-child(3) ul.sub2nav , #menubar #main-menu >ul >li:nth-last-child(3) ul.sub3nav { left: inherit; right: 100%; }
#menubar #main-menu ul.subnav >li ul.sub2nav li >a { background: #fff; }
#menubar #main-menu ul.subnav >li >a , #menubar #main-menu ul.subnav >li >p , #menubar #main-menu ul.subnav >li ul li >a { padding: 10px 20px; display: block; font-size: 15px; color: #383838; }
#menubar #main-menu ul.subOption { position: absolute; width: 200px; display: none; text-align: left; left: 100%; top: -3px; }
#menubar #main-menu ul.subOption >li:first-child { border-top: 3px solid #f6a266; }

/* g-map */
#g-map { position: relative; background: #fff; z-index:2; }

/* footer */
footer {position: relative;background: #08192D;font-size: 15px;color: #d2d2d2;z-index:2;}
footer .workframe { overflow: hidden; margin: 0 auto; width: 80%; }
footer #footerCompany {padding: 60px 0 40px;}
footer #footerCompany .row {width: calc((100%/3) - 60px);display: inline-block;vertical-align: top;}
footer #footerCompany .row:last-child{
    width: 155px;
}
footer #footerCompany .row h2 {margin-bottom: 20px;font-size: 18px;font-weight: bold;letter-spacing: 2px;color: #fff;}
footer #footerCompany .row h2 span {margin-right: 15px;width: 8px;height: 8px;background: #fff;display: inline-block;vertical-align: middle;display: none;}
footer #footerSet { padding: 0 0 50px; }
footer #footerCompany .comlist , footer #footerCompany .fcontact , footer #footerCompany .footernav { max-width: 80%; }
footer #footerCompany #footer-qrcode {margin: 0 0 10px;width: 155px;}
footer #footerCompany .sedc >div { margin-bottom: 3px; display: inline-block; vertical-align: top; }
footer #footerCompany .sedc >div a { padding: 0 25px; height: 40px; background: #5a3a34; display: block; text-align: center; line-height: 40px; font-size: 16px; font-family: 'Oswald',sans-serif; color: #cecece; }
footer #footerCompany .sedc #footer-FB a { background: #394050; }
footer #footerCompany .sedc a b { font-weight: 400; }
footer #footerCompany .comlist li:first-child {}
footer #footerCompany .comlist li b { margin-right: 10px; color: #efefef; vertical-align: middle; }
footer #footerCompany .comlist li span { vertical-align: middle; }
footer #footerCompany p { margin-bottom: 15px; }
footer #footerCompany p.sitemap , footer #footerCompany p.sitemap a { color: #7acab8; }
footer #footerCompany p a { color: #fff; }
footer #footerCompany .fcontact li { margin-bottom: 5px; }
footer #footerCompany .fcontact li a {padding: 13px 0;background: rgb(255 255 255 / 10%);display: block;text-align: center;color: #fff;transition: all linear .3s;}
footer #footerCompany .footernav li { margin-bottom: 5px; float: left; width: 50%; }
footer #footerCompany .footernav li a , footer #footerCompany .comlist li span a { color: #d2d2d2; }
footer #footerCompany .fcontact { max-width: 80%; }

/* footerSet */
#footerSet .info { overflow: hidden; margin-bottom: 20px; text-align: center; }
footer .info div, footer .info p, footer .info a {display: inline-block;vertical-align: top;font-size: 12px;text-align: center;color: #858586;margin-right: 5px;}
#footerSet .info .SeoWebFooter { display: block; }
#footerSet .info a { color: #818181; }
footer .community {}
footer .community li {margin-right: 5px;display: inline-block;}
footer .community li a { width: 25px; height: 25px; border: 1px solid #5f5f5f; display: block; text-align: center; color: #999; left: 25px; }
footer #footerCompany .comlist ,
footer #footerCompany .plus-information { overflow: visible; }
footer #footerCompany .plus-information a { position: relative; display: inline-block; }
footer #footerCompany .plus-information img { position: absolute; max-width: 150px; max-height: 150px; display: none; bottom: 100%; left: 0; z-index: 8; }
.web {padding: 20px 0;background: hsl(0deg 0% 0% / 15%);color: #fff;font-size: 8pt;}
#footer-cis { margin-bottom: 60px; text-align: center; }

/* gotop */
#gotop {position: fixed;display: block;text-align: center;color: #fff;right: 20px;bottom: 20px;z-index: 99;background: #08192d;font-size: 14px;width: 40px;height: 40px;line-height: 43px;font-weight: bold;}
#gotop b {position: relative;display: block;font-weight: 400;font-family: 'Roboto', sans-serif;}
#gotop b:after { position: absolute; width: 1px; height: 30px; background: #9c8560; display: block; left: calc(50% + 14px); bottom: 30px; z-index: 2; transition: all linear .2s; }
#gocart { position: fixed; width: 25px; height: 50px; border: 1px solid #656565; display: block; text-align: center; line-height: 50px; font-size: 15px; color: #9c8560; right: 20px; bottom: 130px; z-index: 9; }

/* ssbanner */
#ssbanner {position: relative;overflow: hidden;display: none;}
#ssbanner .bigname h2 { margin: 70px 0 10px; line-height: 120%; text-align: center; font-size: 30px; color: #585757; }
#ssbanner .bigname p { text-align: center; font-size: 16px; line-height: 120%; color: #4e4e4e; }
#ssbanner a { background: no-repeat 50% / cover; display: block; }
#ssbanner a img { width: 100%; }
#ssbanner .bxslider { overflow: hidden; }
#ssbanner .bxslider >div { float: left; width: 25%; }

/* SeoStarRating */
#SeoStarRating{text-align:center;}
#SeoStarRating font {margin-right: 5px;display: inline-block;vertical-align: middle;font-size: 14px;}
#SeoStarRating font:first-child {font-weight: bold;font-size: 15px;color: #cbcacd;}
#SeoStarRating font:nth-child(2) {font-size: 14px;color: #cbcacd;vertical-align: baseline;}
#SeoStarRating font:last-child {color: #828282;}

@media screen and (max-width: 1440px) {
	header #cis {width: 250px;}
	header:after{width: 310px;}
	footer .workframe{width: 90%;}
	header #menubar {width: calc(100% - 500px);}
}
@media screen and (max-width:1280px) {
	#menubar #main-menu >ul >li >a b { font-size: 12px; }
	#menubar #main-menu >ul >li >a {padding: 0 15px;height: 43px;margin: 0 10px;}
	header #topContact, header #Wlanguage{margin: 0;display: flex;justify-content: flex-end;}
	footer #footerCompany .row:last-child{display:none;}
	footer #footerCompany .row{width: calc((100%/3) - 5px);}
}
@media screen and (min-width:1025px) {
	header #topContact h3 a:hover , header #translate h3 b:hover , header #Wlanguage h3 a:hover { opacity: 1; }
	#translate #goSearch:hover { background: #e1224e; }
	#menubar #main-menu >ul >li:hover >a {color: #0B346E;}
	#menubar #main-menu >ul >li:hover ul.subnav , #menubar #main-menu ul.subnav li:hover ul.subOption , #menubar #main-menu ul.subnav >li:hover ul.sub2nav , #menubar #main-menu ul.sub2nav li:hover ul.sub3nav , footer #footerCompany .plus-information a:hover img { display: block; }
	#menubar #main-menu ul.subnav >li >a:hover , #menubar #main-menu ul.subnav >li >p:hover , #menubar #main-menu ul.subnav >li ul li >a:hover { background: #dadada; }
	footer #footerCompany .fcontact li a:hover , footer #footerCompany .sedc >div a:hover { opacity: .8; }
	footer #footerCompany .footernav li a:hover { color: #afb5b9; }
	#footerSet .community li a:hover { background: #5f5f5f; color: #fff; }
	#ssbanner .bigname { position: absolute; width: 100%; height: 100%; left: 0; bottom: 0; z-index: 5; background: linear-gradient(to bottom,hsla(0, 0%, 100%, .96) 1%,hsla(0, 0%, 100%, .67) 60%,rgba(255, 255, 255, 0) 100%); transition: all linear .4s; }
	#ssbanner:hover .bigname { bottom: 100%; z-index: -1; opacity: 0; }
	#gotop:hover b:after { bottom: 70px; }
	.phoneWrap { display: none!important; }
}
@media screen and (max-width:1024px) {
	header #menubar #main-menu >ul >li >a, header #topContact p, header.headerTop #topContact p a, header #topContact img{
    color: #fff;
    -webkit-filter: contrast(0) brightness(150%);
    filter: contrast(0) brightness(200%);
}
	header:after{display:none;}
	header #menubar { display: none; }
	header  {position: fixed;padding: 10px 30px;width: calc(100% - 60px);background: #0b346e;display: block;left: 0;top: 0;z-index: 8;}
	.mobile-main-nav { display: block; }
	.nav-funcB {position: fixed;font-size: 23px;color: #fff;left: 30px;top: 18px;}
	.nav-funcB:hover {color: #fff;}
	#mobile-menu {overflow: auto;padding-bottom: 70px;position: fixed;width: 280px;height: calc(100vh - 138px);background: #f1f1f1;top: 68px;left: 0;}
	#mobile-menu >ul >li .menu_head , .subOption >li .sub2Title , .subOption >li .sub3Title {overflow: hidden;position: relative;padding: 15px;border-bottom: 1px solid rgb(82 82 82 / 10%);}
	#mobile-menu >ul >li .menu_head.c0 b , .subOption >li .sub2Title.c0 b { display: none; }
	#mobile-menu >ul >li .menu_head p , .subOption >li .sub2Title p , .subOption >li .sub3Title p { float: left; width: calc(100% - 20px); font-size: 11pt; }
	#mobile-menu >ul >li .menu_head a , .subOption >li .sub2Title a , .subOption >li .sub3Title a {color: #333;display: block;font-weight: bold;letter-spacing: 1px;}
	#mobile-menu >ul >li .menu_head b , .subOption >li .sub2Title b , .subOption >li .sub3Title b { position: absolute; width: 50px; height: 56px; text-align: center; line-height: 56px; color: #616161; cursor: pointer; right: 0; top: 0; }
	#mobile-menu >ul >li .menu_body li p , .subOption >li .sub2Option li p { padding: 5px 15px; background: #b5b5b5; border-bottom: 1px solid #525252; font-size: 14px; }
	#mobile-menu >ul >li .menu_body li a , .subOption >li .sub2Option li p a { padding: 10px 35px; display: block; font-size: 11pt; color: #474747; }
	#mobile-menu .subOption >li .sub2Title { padding: 15px 15px 15px 30px; background: #f5f5f5; font-size: 14px; }
	#mobile-menu .subOption >li .sub2Title p { padding: 0; border: 0; background: none; }
	#mobile-menu .subOption >li .sub2Title p a { padding: 0; border: none; color: #474747; }
	#mobile-menu .subOption >li .sub2Title.bo p a { display: inline-block; color: #474747; }
	#mobile-menu .subOption >li .sub3Title { padding: 15px 15px 15px 45px; background: #d4d4d4; }
	#mobile-menu .subOption >li .sub3Title p { padding: 0; width: calc(100% - 20px - 30px); background: none; border: 0; }
	#mobile-menu .subOption >li .sub3Title p a { padding: 0; color: #474747; }
	#mobile-menu .subOption >li .sub3Option p { padding: 15px 10px 15px 55px; }
	#mobile-menu .subOption >li .sub3Option p a { padding: 0; color: #313131; }
	header .rightTab { overflow: hidden; margin: 0 auto; padding: 10px 5%; float: none; background: #efefef; text-align: center; }
	header #cis  {margin-left: 50px;}
	header #cis h2 { text-align: center; }
	header .rightTab .topphone p a { font-size: 30px; }
	header .rightTab .topphone { margin: 0; float: right; }
	header .rightTab .translate { float: left; }
	header .workframe { width: 100%; }
	footer #footerCompany .row { margin-bottom: 50px; width: calc(50% - 4px); }
	footer #footerCompany .row:last-child , footer #footerCompany .row:nth-child(3) { margin-bottom: 0; }
	header #topContact h3 , header #translate h3 , header #Wlanguage h3 { margin-top: 20px; }
	header #topContact h3 a , header #translate h3 b , header #Wlanguage h3 a { overflow: hidden; padding-top: 30px; height: 0; }
	#translate form { top: 100px; right: 15px; }
	#ssbanner .bxslider >div { width: 50%; }
	#ssbanner .bigname { overflow: hidden; margin-bottom: 50px; }
}
@media screen and (max-width:640px) {
	.phoneWrap {position: fixed;width: calc(100% - 60px);display: block !important;bottom: 10px;left: 10px;z-index: 99;}
	.phoneWrap li { width: calc(50% - 4px); display: inline-block; }
	.phoneWrap li a {padding: 5px 15px;background: rgb(197 26 14);display: block;text-align: center;line-height: 30px;font-size: 9pt;color: #fff;}
	.phoneWrap li:nth-child(2) a { background: rgb(23 120 18 / .94); }
	footer #footerCompany .row , footer #footerCompany .comlist , footer #footerCompany .fcontact , footer #footerCompany .footernav { width: 100%; max-width: 100%; }
	footer #footerCompany .row:nth-child(3) {margin-bottom: 0;}
	footer #footerCompany .row:last-child , #footerSet .community , #footerSet .info , #footerSet .info .SeoWebFooter { text-align: center; }
	footer #footerCompany .footernav li , footer .sitemap { text-align: left; }
	#footerSet .info , #footerSet .community { width: 100%; }
	#footerSet .community { margin-top: 20px; }
	.web { padding-bottom: 60px; }
	#gotop , #Wlanguage a , #translate h3 , #gocart { right: 15px; }
	.nav-funcB {top: 19px;left: 35px;}
	header #cis {margin-left: calc(50% - 110px);width: 200px;}
	header #topContact h3 , header #translate h3 , header #Wlanguage h3 { margin-top: 14px; }
	header #translate { margin: 0 5px; }
	header #topContact h3 a , header #translate h3 b , header #Wlanguage h3 a { padding-top: 25px; min-width: 40px; background-size: auto 25px; }
	#mobile-menu {height: calc(100vh - 128px);top: 64px;width: 100%;}
	#translate form { top: 80px; }
	header #topContact, header #Wlanguage{display:none;}
	#gotop {
    bottom: 10px;
    right: 10px;
}
}
@media screen and (max-width:480px) {
	footer #footerCompany { padding: 50px 0; }
	header {padding: 15px;width: calc(100% - 30px);}
	.nav-funcB {left: 20px;}
	#ssbanner .bxslider >div { margin: 0 10px 10px; width: calc(100% - 20px); }
}