@charset "UTF-8";
body { font-family: "微軟正黑體", Verdana, Geneva, sans-serif; color: #232020; line-height: 28px; font-size: 15px; position: relative; background-color: #fff; -webkit-text-size-adjust: none; overflow-x: hidden; }

a { color: #232020; text-decoration: none; }
a:hover { color: #b6261d; text-decoration: none; }

.hide { display: none; }

.clean { clear: both; line-height: 0; height: 0; }

.left { float: left; }

.right { float: right; }

.wrapper { width: 100%; max-width: 1440px; margin: 0 auto; position: relative; }

.red { color: #cc0000; }

.all-title { padding: 35px 0; text-align: center; background-image: url("../images/titleBG.gif"); background-position: 0 0; background-repeat: repeat; position: relative; z-index: 0; }
.all-title h3 { font-size: 30px; line-height: 30px; display: inline; position: relative; font-weight: bold; }
.all-title h3 span { text-transform: uppercase; color: #aa0900; font-size: 13px; line-height: 22px; font-weight: bold; position: absolute; left: -moz-calc(100% + 15px); left: -webkit-calc(100% + 15px); left: calc(100% + 15px); bottom: 0; }
@media only screen and (max-width: 480px) { .all-title h3 { font-size: 23px; } }

header { width: 100%; background-color: #fff; position: fixed; top: 0; z-index: 9999; }

.logo { padding: 35px 0 0 60px; position: absolute; }
.logo h1 { position: absolute; text-indent: -9999px; }
.logo a { display: block; }
.logo a img { width: 100%; display: block; }
@media only screen and (max-width: 840px) { .logo { padding-left: 40px; }
  .logo a { width: 210px; } }
@media only screen and (max-width: 768px) { .logo { padding-top: 10px; padding-left: 25px; position: relative; float: left; } }
@media only screen and (max-width: 480px) { .logo { padding-left: 15px; }
  .logo a { width: 165px; } }

.top-link { padding: 20px 20px 14px 0; }
@media only screen and (max-width: 768px) { .top-link { padding: 10px 10px 10px 0; } }

.burger { width: 35px; height: 35px; margin-left: 5px; background-color: #4b4b4b; float: right; border-radius: 100%; position: relative; display: none; }
.burger li { width: 60%; height: 2px; margin: auto; background-color: #fff; position: absolute; top: 0; right: 0; bottom: 0; left: 0; -moz-transition: all 0.2s ease-out; -o-transition: all 0.2s ease-out; -webkit-transition: all 0.2s ease-out; transition: all 0.2s ease-out; }
.burger li:after, .burger li:before { content: ""; width: 100%; height: 2px; background-color: #fff; position: absolute; -moz-transition: all 0.8s ease-out; -o-transition: all 0.8s ease-out; -webkit-transition: all 0.8s ease-out; transition: all 0.8s ease-out; }
.burger li:after { bottom: -5px; }
.burger li:before { top: -5px; }
.burger.burger-on li { background-color: transparent; }
.burger.burger-on li:after { bottom: 0px; -moz-transform: rotate(-225deg); -ms-transform: rotate(-225deg); -webkit-transform: rotate(-225deg); transform: rotate(-225deg); }
.burger.burger-on li:before { top: 0px; -moz-transform: rotate(225deg); -ms-transform: rotate(225deg); -webkit-transform: rotate(225deg); transform: rotate(225deg); }
@media only screen and (max-width: 840px) { .burger { display: block; } }
@media only screen and (max-width: 768px) { .burger { width: 30px; height: 30px; } }

.member { margin-left: 15px; float: right; text-align: right; }
.member li { margin: 0 2px; display: inline-block; }
.member li:nth-child(1) a { background-color: #adadad; }
.member li:nth-child(2) a { background-color: #fe791a; }
.member li a { width: 35px; height: 35px; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; display: block; color: #fff; font-size: 12px; line-height: 35px; text-align: center; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.member li a:hover { background-color: #b6261d; }
@media only screen and (max-width: 768px) { .member { margin-left: 0; }
  .member li { margin: 0; }
  .member li a { width: 30px; height: 30px; line-height: 30px; } }

.status { padding-top: 3px; float: right; font-size: 12px; }
@media only screen and (max-width: 768px) { .status { display: none; } }

.nav { padding: 0 0 15px 0; }
.nav ul { text-align: right; }
.nav ul li { margin: 0 15px; display: inline-block; }
.nav ul li a { padding: 15px 0; display: block; }
.nav ul li:first-child a{ color:#cc0000; }
@media only screen and (max-width: 768px) { .nav { padding-bottom: 0; clear: both; background-color: #4b4b4b; }
  .nav ul { text-align: center; }
  .nav ul li { margin: 0; width: -moz-calc(20% - 5px); width: -webkit-calc(20% - 5px); width: calc(20% - 5px); }
  .nav ul li a { padding: 8px 0; color: #fff; }
  .nav ul li:first-child a{ color:#fe791a; } }
@media only screen and (max-width: 380px) { .nav ul li a { padding: 5px 0; font-size: 13px; } }

.nav2 { overflow: none; }
@media only screen and (max-width: 840px) { .nav2 { width: 100%; position: absolute; right: 100%; z-index: 9999; -moz-transition: all 0.8s ease-out; -o-transition: all 0.8s ease-out; -webkit-transition: all 0.8s ease-out; transition: all 0.8s ease-out; }
  .nav2.nav2-open { right: 0px; overflow-x: hidden; } }

.menu { width: 100%; margin: 0 auto; padding: 0 56px; text-align: left; position: relative; background-color: #4b4b4b; box-sizing: border-box; }
.menu li { display: inline-block; }
.menu li a { padding: 13px 24px 13px 15px; display: block; color: #fff; position: relative; line-height: 20px; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
.menu li a:after { content: ""; width: 0; height: 0; border-style: solid; border-width: 4px 3.5px 0 3.5px; border-color: #ffffff #4b4b4b #4b4b4b #4b4b4b; background-color: #fff; display: block; position: absolute; top: 50%; right: 10px; -moz-transition: all 0.2s ease-in; -o-transition: all 0.2s ease-in; -webkit-transition: all 0.2s ease-in; transition: all 0.2s ease-in; }
.menu li a:hover { background-color: white; color: #b6261d; }
.menu li a:hover:after { border-color: #b6261d #fff #fff #fff; }
@media only screen and (max-width: 840px) { .menu { background-color: #383838; padding: 10px; }
  .menu li { display: block; }
  .menu li a { display: block; } }

.menu .sub-menu { width: 100%; max-width: 210px; height: 0; background-color: rgba(255, 255, 255, 0.8); position: absolute; top: 100%; display: block; opacity: 0; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; overflow: hidden; box-sizing: border-box; }
.menu .sub-menu.nav-open { height: auto; padding: 10px; opacity: 1; box-sizing: border-box; text-align: left; }
.menu .sub-menu.nav-open li { display: block; }
.menu .sub-menu.nav-open li a { padding: 8px 10px; display: block; color: #222; font-size: 13px; }
.menu .sub-menu.nav-open li a:after { display: none; }
.menu .sub-menu.nav-open li a:hover { background: rgba(255, 255, 255, 0.9); }
.menu .sub-menu.nav-open li a:hover:after { display: none; }
@media only screen and (max-width: 840px) { .menu .sub-menu { max-width: 100%; background-color: #707070; height: auto; opacity: 1; position: relative; -moz-transition: width 0.3s ease-out; -o-transition: width 0.3s ease-out; -webkit-transition: width 0.3s ease-out; transition: width 0.3s ease-out; }
  .menu .sub-menu li a { display: block; color: #fff; font-size: 13px; }
  .menu .sub-menu li a:after { display: none; }
  .menu .sub-menu li a:hover { color: #b6261d; background-color: #fff; }
  .menu .sub-menu.nav-open { padding: 0; }
  .menu .sub-menu.nav-open li { width: auto; display: block; float: none; } }

.pro-area { padding: 50px 15px 80px 15px; background-color: #faf9f7; }
@media only screen and (max-width: 768px) { .pro-area { padding: 30px 10px 60px 10px; } }
@media only screen and (max-width: 480px) { .pro-area { padding: 25px 0 25px 0; } }

.pro-nav { margin-bottom: 20px; overflow-x: hidden; }
.pro-nav li { width: -moz-calc(25% - 26px); width: -webkit-calc(25% - 26px); width: calc(25% - 26px); margin: 0 13px 20px 13px; float: left; display: block; }
.pro-nav li a { width: 100%; height: 60px; padding-top: 16px; display: block; background-color: #afafaf; text-align: center; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; font-size: 18px; font-weight: bold; color: #fff; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.pro-nav li a.current { position: relative; background-color: #cc0000; }
.pro-nav li a.current:after { content: ""; width: 0; height: 0; margin: 0 auto; border-style: solid; border-width: 12px 7px 0 7px; border-color: #cc0000 #faf9f7 #faf9f7 #faf9f7; background-color: #c0000; display: block; position: absolute; left: 0; right: 0; bottom: -12px; }
@media only screen and (max-width: 768px) { .pro-nav li { width: -moz-calc(50% - 10px); width: -webkit-calc(50% - 10px); width: calc(50% - 10px); margin: 0 5px 10px 5px; }
  .pro-nav li a { height: 50px; padding-top: 11px; }
  .pro-nav li a.current:after { -moz-transform: rotate(-90deg); -ms-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); transform: rotate(-90deg); border-width: 10px 15px 0 15px; border-color: #faf9f7 #cc0000 #cc0000 #cc0000; margin: auto; left: -10px; top: 0; right: auto; bottom: 0; } }
@media only screen and (max-width: 480px) { .pro-nav li a { height: 40px; padding-top: 6px; font-size: 15px; } }

.slick-track { padding: 5px 0; }

.pro-show { min-height: 455px; }

.pro-run { width: 100%; max-width: 100%; }

.go-run1, .go-run2, .go-run3, .go-run4 { position: relative; overflow: hidden; }
.go-run1 .pro-prev, .go-run1 .pro-next, .go-run2 .pro-prev, .go-run2 .pro-next, .go-run3 .pro-prev, .go-run3 .pro-next, .go-run4 .pro-prev, .go-run4 .pro-next { width: 55px; height: 55px; position: absolute; top: -moz-calc(50% - 27px); top: -webkit-calc(50% - 27px); top: calc(50% - 27px); z-index: 5; }
.go-run1 .pro-prev, .go-run2 .pro-prev, .go-run3 .pro-prev, .go-run4 .pro-prev { background-image: url("../images/arrow-prev.png"); background-position: 0 0; background-repeat: no-repeat; left: 25px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.go-run1 .pro-prev:hover, .go-run2 .pro-prev:hover, .go-run3 .pro-prev:hover, .go-run4 .pro-prev:hover { background-position: -55px 0; }
.go-run1 .pro-next, .go-run2 .pro-next, .go-run3 .pro-next, .go-run4 .pro-next { background-image: url("../images/arrow-next.png"); background-position: 0 0; background-repeat: no-repeat; right: 25px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.go-run1 .pro-next:hover, .go-run2 .pro-next:hover, .go-run3 .pro-next:hover, .go-run4 .pro-next:hover { background-position: -55px 0; }

.pro-list { width: -moz-calc(25% - 26px); width: -webkit-calc(25% - 26px); width: calc(25% - 26px); max-height: 475px; margin: 0 13px; padding: 20px; float: left; background-color: #fff; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-transition: all 0.5s ease-out; -o-transition: all 0.5s ease-out; -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; }
.pro-list:hover { -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 0 5px 0; -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 0 5px 0; box-shadow: rgba(0, 0, 0, 0.3) 0 0 5px 0; }

.pro-img { margin-bottom: 10px; max-height: 294px; overflow: hidden; display: block; }
.pro-img img { width: 100%; max-height: 294px; display: block; }

.pro-brand { display: block; text-transform: uppercase; text-align: center; }
.pro-brand a { display: block; font-size: 20px; color: #cc0000; }

.pro-title { margin-bottom: 25px; display: block; text-align: center; }
.pro-title a { display: block; position: relative; }
.pro-title a:after { content: ""; width: 25px; height: 1px; background-color: #494949; position: absolute; margin: 0 auto; left: 0; right: 0; bottom: -13px; }

.pro-price { display: block; text-align: center; font-family: "Times New Roman"; font-style: italic; color: #000; }

.slick-dots { display: none !important; }

.view-all { width: 88px; height: 30px; font-size: 13px; line-height: 30px; text-transform: uppercase; color: #000; text-align: center; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-weight: bold; border: 1px solid #000; position: absolute; top: -70px; right: 30px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.view-all:hover { background-color: #b6261d; color: #fff; border: 1px solid #b6261d; }
@media only screen and (max-width: 480px) { .view-all { display: none; } }

.news-area { padding: 20px 0; }
@media only screen and (max-width: 480px) { .news-area { padding-top: 0; } }

.news-list { width: -moz-calc(33.333% - 60px); width: -webkit-calc(33.333% - 60px); width: calc(33.333% - 60px); margin: 0 28px 60px 28px; display: inline-block; vertical-align: top; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.news-list .news-img { padding: 0 0 56.29% 0; display: block; background-color: #1e1b1b; background-position: center center; background-repeat: no-repeat; background-size: contain; }
.news-list .news-txt { padding: 18px 22px; background-color: #f1f1f1; }
.news-list .news-txt .news-date { font-size: 13px; color: #cc0000; }
.news-list .news-txt h4 { padding-bottom: 5px; display: block; font-size: 18px; }
.news-list .news-txt h4 a { width: 100%; color: #000; text-transform: uppercase; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; display: block; }
.news-list .news-txt h4 a:hover { color: #b6261d; }
.news-list .news-txt .news-info { max-height: 75px; color: #606060; line-height: 25px; overflow: hidden; }
.news-list:hover { -moz-transform: translate(0, -15px); -ms-transform: translate(0, -15px); -webkit-transform: translate(0, -15px); transform: translate(0, -15px); }
@media screen and (max-width: 1000px) { .news-list { width: -moz-calc(50% - 60px); width: -webkit-calc(50% - 60px); width: calc(50% - 60px); } }
@media only screen and (max-width: 768px) { .news-list { width: -moz-calc(50% - 40px); width: -webkit-calc(50% - 40px); width: calc(50% - 40px); margin: 0 17px 40px 17px; } }
@media screen and (max-width: 500px) { .news-list { width: -moz-calc(100% - 30px); width: -webkit-calc(100% - 30px); width: calc(100% - 30px); margin: 0 13px 20px 13px; }
  .news-list:hover { -moz-transform: translate(0, 0px); -ms-transform: translate(0, 0px); -webkit-transform: translate(0, 0px); transform: translate(0, 0px); } }

.about-area { padding: 110px 10px 90px 10px; background-image: url("../images/aboutBG.jpg"); background-position: center center; background-repeat: no-repeat; background-color: #000000; color: #fff; }
@media only screen and (max-width: 480px) { .about-area { padding: 60px 10px 60px 10px; } }

.about-title { padding-bottom: 40px; font-size: 50px; line-height: 60px; font-weight: bold; text-align: center; }
@media only screen and (max-width: 480px) { .about-title { font-size: 40px; } }

.about-info { width: 100%; max-width: 320px; margin: 0 auto; padding-top: 35px; border: 1px solid #fff; -moz-border-radius: 100%; -webkit-border-radius: 100%; border-radius: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; position: relative; }
.about-info h4 { text-align: center; text-transform: uppercase; }
.about-info .about-txt { margin-bottom: 23px; display: block; text-align: center; font-size: 26px; line-height: 30px; }
.about-info:before { content: ""; width: 1px; height: 42px; background-color: #fff; position: absolute; margin: 0 auto; top: -27px; left: 0; right: 0; }
@media only screen and (max-width: 480px) { .about-info .about-txt { margin-bottom: 15px; font-size: 24px; } }

.foot-area { padding: 55px; overflow: hidden; border-top: 1px solid #000; }
@media screen and (max-width: 840px) { .foot-area { padding: 30px 15px; } }

.fnav-area { width: -moz-calc(100% - 340px); width: -webkit-calc(100% - 340px); width: calc(100% - 340px); float: left; overflow: hidden; }
@media screen and (max-width: 840px) { .fnav-area { display: none; } }

.foot-nav { width: -moz-calc(14.285% - 20px); width: -webkit-calc(14.285% - 20px); width: calc(14.285% - 20px); margin: 0 8px; display: inline-block; vertical-align: top; }
.foot-nav h4 { padding-bottom: 10px; margin-bottom: 8px; font-size: 20px; font-weight: bold; color: #000; position: relative; }
.foot-nav h4:after { content: ""; width: 17px; height: 1px; background-color: #000; position: absolute; left: 0; bottom: 0; }
.foot-nav .foot-menu li { display: block; }
.foot-nav .foot-menu li a { padding: 4px 0; display: block; line-height: 20px; text-transform: uppercase; }
@media screen and (max-width: 1200px) { .foot-nav { width: 100%; margin: 0 0 10px 0; display: block; }
  .foot-nav h4 { padding-bottom: 3px; margin-bottom: 0; }
  .foot-nav h4:after { display: none; }
  .foot-nav .foot-menu { margin-right: 20px; padding-bottom: 7px; border-bottom: 1px solid #ccc; }
  .foot-nav .foot-menu li { width: -moz-calc(25% - 13px); width: -webkit-calc(25% - 13px); width: calc(25% - 13px); margin: 0 10px 0 0; display: inline-block; vertical-align: top; }
  .foot-nav .foot-menu li a { padding: 0; } }

.fb { width: 340px; float: left; }
@media screen and (max-width: 840px) { .fb { width: 100%; max-width: 500px; float: none; margin: 0 auto; } }

footer { padding: 20px 50px; border-top: 1px solid #000; }
@media only screen and (max-width: 768px) { footer { padding: 20px 15px; } }

.copyright { float: right; color: #7f8080; }
.copyright a { color: #7f8080; line-height: 20px; }
@media screen and (max-width: 1220px) { .copyright { width: 100%; float: none; text-align: center; } }

.foot-nav2 { float: left; }
.foot-nav2 li { display: inline-block; }
.foot-nav2 li a { padding: 0 10px; display: block; color: #cc0000; line-height: 20px; position: relative; }
.foot-nav2 li a:hover { color: #000; }
.foot-nav2 li a:before { content: ""; width: 1px; height: 18px; display: block; background-color: #cc0000; position: absolute; top: 2px; left: 0; }
.foot-nav2 li:first-child a:before { display: none; }
@media screen and (max-width: 1220px) { .foot-nav2 { width: 100%; float: none; margin-bottom: 10px; text-align: center; } }

.breadcrumb { width: 100%; max-width: 1440px; margin: 0 auto; padding: 10px 15px; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; text-align: right; }
.breadcrumb ul li { display: inline-block; }
.breadcrumb ul li a { display: inline-block; padding-right: 3px; }

.page { text-align: center; padding-bottom: 50px; }
.page a, .page .current { width: 25px; height: 25px; margin: 0 1px; text-align: center; line-height: 25px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; border: 1px solid #000; display: inline-block; }
.page .current { background-color: #cc0000; color: #fff; border: 1px solid #cc0000; }
.page a:hover { background-color: #cc0000; color: #fff; border: 1px solid #cc0000; }

.show-title { margin: 0 15px; padding: 15px; border: 1px solid #000; }
.show-title .show-date { width: 108px; height: 36px; line-height: 36px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; text-align: center; background-color: #e3e3e3; display: inline-block; vertical-align: middle; font-size: 13px; color: #b6261d; }
.show-title h4 { width: -moz-calc(100% - 128px); width: -webkit-calc(100% - 128px); width: calc(100% - 128px); margin-left: 16px; display: inline-block; font-size: 23px; color: #000; vertical-align: middle; }
@media only screen and (max-width: 768px) { .show-title .show-date { display: block; margin-bottom: 5px; }
  .show-title h4 { width: 100%; margin: 0; display: block; } }

.btn-area { padding: 20px 10px 40px 10px; text-align: center; }

.btn, .btn-fb { width: 115px; height: 38px; display: inline-block; line-height: 38px; border: 1px solid #000; color: #000; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -webkit-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
.btn:hover, .btn-fb:hover { background-color: #cc0000; color: #fff; border: 1px solid #cc0000; }

.btn-fb { margin-right: 10px; background-color: #255bc8; background-image: url("../images/btn-fb.png"); background-position: 15px center; background-repeat: no-repeat; border: 1px solid #255bc8; color: #fff; }
.btn-fb:hover { background-color: #cc0000; border: 1px solid #cc0000; }

.news-edit { padding: 30px 30px; }

.edit { overflow: hidden; }
.edit img, .edit iframe { max-width: 100%; /*height: auto;*/ }
.edit img{ height: auto; }
.edit table { width: 100%; max-width: 100%; }
.edit table td { padding: 8px 10px; }
.edit ul li { list-style-type: disc; }
.edit ol li { list-style-type: decimal; }
.edit em { font-style: italic; }
