@charset "utf-8";
@import url(font-awesome.min.css);
body { background-color:#def1f8; width:100%; height:100%; margin:0; padding:0; font-family:"微軟正黑體";  font-size: 14px; line-height: 20px;}
html { width:100%; height:100%;}

.warpper { padding:0; margin:38px 0 0 0;}
.clearfix:after {content: ".";display: block;height: 0;clear: both;visibility: hidden;}/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}/* End hide from IE-mac */
a { text-decoration:none;}
img { border:0; vertical-align:middle;}
input { vertical-align:middle;}
.slicknav_menu {display:none;}
input.select-box { border:1px #CBCBCB solid; padding:5px 3%; width:20px; height:20px; text-align:center; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom:5px; }


/*** padding and border no width ****/
*{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
}



/***** 表單預設文字顏色設定 *****/
/* 通用 */
::-webkit-input-placeholder { color: #333; }
::-moz-placeholder { color:#333; } /* firefox 19+ */
:-ms-input-placeholder { color:#333; } /* ie */
input:-moz-placeholder { color:#333; }

/* webkit专用 */
#field2::-webkit-input-placeholder { color:#333; }
#field3::-webkit-input-placeholder { color:#333; background:lightgreen; text-transform:uppercase; }
#field4::-webkit-input-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#333; }

/* mozilla专用 */
#field2::-moz-placeholder { color:#333; }
#field3::-moz-placeholder { color:#333; background:lightgreen; text-transform:uppercase; }
#field4::-moz-placeholder { font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999; }



header { position:fixed; width:100%; z-index:99; }
.head-main-extend{ background-color:rgba(201, 231, 243, .9); position:relative; z-index:1; }
.head-main { max-width:1140px; margin:0 auto; height:96px; padding:0; position:relative; }

.head-main .logo {  position:absolute; left:5px; top: 10px; float:left; width:34.65%;height:auto;}
.head-main .logo img { max-width:100%; height:auto; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.home { display: block; position:absolute; top:-35px; right:0px; width:25px; height:auto;}
.home_w { display:none;}
@media screen and (max-width: 1180px) {
	.head-main .logo { top: 15px;}
	.head-main .logo img { height:auto; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
}
.head-tool { display:inline-block; position:absolute; top:5px; right:5px; text-align:center; overflow:hidden;}
@media screen and (max-width:900px){
	.head-tool { display:none; }
}
.head-tool li { list-style:none; padding:0px 5px; margin:0; float:left; width:40px;}
.head-tool li a { display:inline-block; margin:0; padding:3px 5px; color:#6f59b3; font-size:15px;}
.head-tool li a:hover { color:#116e8b; }


.banner { width:100%; max-width:1140px; margin:0 auto; padding-top:120px; z-index:-99999; }
.banner img { width:100%; height:auto;}
.banner-bg {position:relative;height:0px; margin:-3% 0 0 0;z-index:99; display:none;}
.banner-bg img { width:100%; height:auto;}



/***  選單與下拉  ***/
nav {  }
 .menu { padding:0; list-style:none;  max-width:1140px; position: absolute; top:40px; right:0; text-align: right; float:left; width:64.35%; margin:0 0 0 1%;}
 .menu>li { color:#fff;  font-size:16px; text-align:center; position:relative;  line-height:30px; display:inline-table; margin:0 2%; }
 .menu>li.style02{ color:#fff;  font-size:16px; text-align:center; position:relative;  line-height:33px; display:inline-table; margin:0 1%; }
 .menu>li.mobile-only { display:none; }
 .menu>li>a { color:#4d4d4d; display:block; padding:2px 2px;}  
 .menu>li>a:hover { border-bottom:2px solid #C00; border-top:2px solid #C00; color:#e72330; padding:0 2px; }

 .menu>li>ul { display:none; margin:0; padding:0; -webkit-border-radius: 0 0 5px 5px; -moz-border-radius: 0 0 5px 5px;border-radius: 0 0 5px 5px;}
 .menu>li:hover>ul { position:absolute; display: block; width:auto; left:0; top:47px;}
 .menu>li>ul>li { display:block; border-bottom:1px #EEE dotted; }
 .menu>li>ul>li>a {display:block; color:#fff; padding:.5em .5em; line-height:1.2em;/* white-space:nowrap; word-break:keep-all;*/}
 
@media screen and (max-width: 900px) {
	.slicknav_menu { display:none;}
	.js #menu {	display:none;}
	.js .slicknav_menu {display:block; position:fixed; width:100%; z-index:99; max-height:100vh; overflow:auto;}
} 
 
 
/** 次選單 **/
.menu.sub-menu>li { position:relative; }
.menu.sub-menu>li>a { } 
.menu.sub-menu>li>a:hover {} 
.menu.sub-menu>li:hover {  }
 
.menu.sub-menu>li>ul { position:absolute; display:none; margin:0; padding:10px; z-index:9999; max-height:calc(100vh - 70px); overflow:auto;}
.menu.sub-menu>li>ul:before{ content:" "; display:block; position:absolute; top:3px; left:50%; margin-left:-10px; 
border-style: solid;
border-width: 0 9px 9px 9px;
border-color: transparent transparent #6faefd transparent; z-index:10000;
opacity: .9; /* 透明度90% FireFox 的寫法 */ 
filter: Alpha(Opacity=90); /* 透明度90% IE 的寫法 }
.menu.sub-menu>li>ul .sub-menu-arrow{ position:absolute; top:3px; left:50%; margin-left:-10px; 
opacity: .9; /* 透明度90% FireFox 的寫法 */ 
filter: Alpha(Opacity=90); /* 透明度90% IE 的寫法 */}
.menu.sub-menu>li:hover>ul { position:absolute; width:130px; padding:12px 0 0 0; display: block; left:-50%; top:33px;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px; margin-left:5px; }

.menu.sub-menu>li>ul>li{ font-size:15px; background: #e72330;
 opacity: .9; /* 透明度90% FireFox 的寫法 */ 
filter: Alpha(Opacity=90); /* 透明度90% IE 的寫法 */ }
.menu.sub-menu>li>ul>li>a:hover{ color:#FF6;}


.menu.sub-menu>li.style02:hover>ul { position:absolute; width:130px; padding:12px 0 0 0; display: block; left:-10%; top:33px;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px; margin-left:5px; }

 
/** EDM  **/

/* jssor slider bullet navigator skin 05 css */
        /*
        .jssorb05 div           (normal)
        .jssorb05 div:hover     (normal mouseover)
        .jssorb05 .av           (active)
        .jssorb05 .av:hover     (active mouseover)
        .jssorb05 .dn           (mousedown)
        */
.jssorb05 {position: absolute;}
.jssorb05 div, .jssorb05 div:hover, .jssorb05 .av {
            position: absolute;
            /* size of bullet elment */
            width: 16px;
            height: 16px;
            background: url('../image/b05.png') no-repeat;
            overflow: hidden;
            cursor: pointer;
        }
.jssorb05 div { background-position: -7px -7px; }
.jssorb05 div:hover, .jssorb05 .av:hover { background-position: -37px -7px; }
.jssorb05 .av { background-position: -67px -7px; }
.jssorb05 .dn, .jssorb05 .dn:hover { background-position: -97px -7px; }

        /* jssor slider arrow navigator skin 22 css */
        /*
        .jssora22l                  (normal)
        .jssora22r                  (normal)
        .jssora22l:hover            (normal mouseover)
        .jssora22r:hover            (normal mouseover)
        .jssora22l.jssora22ldn      (mousedown)
        .jssora22r.jssora22rdn      (mousedown)
        .jssora22l.jssora22lds      (disabled)
        .jssora22r.jssora22rds      (disabled)
        */
.jssora22l, .jssora22r {
            display: block;
            position: absolute;
            /* size of arrow element */
            width: 40px;
            height: 58px;
            cursor: pointer;
            background: url('../image/a22.png') center center no-repeat;
            overflow: hidden;
        }
.jssora22l { background-position: -10px -31px; }
.jssora22r { background-position: -70px -31px; }
.jssora22l:hover { background-position: -130px -31px; }
.jssora22r:hover { background-position: -190px -31px; }
.jssora22l.jssora22ldn { background-position: -250px -31px; }
.jssora22r.jssora22rdn { background-position: -310px -31px; }
.jssora22l.jssora22lds { background-position: -10px -31px; opacity: .3; pointer-events: none; }
.jssora22r.jssora22rds { background-position: -70px -31px; opacity: .3; pointer-events: none; }



/*** 首頁消息 ***/
.i-news{ max-width:1140px; margin:0 auto 50px auto;}
.i-news h2{ max-width:250px ; margin:0 auto 15px auto;  font-size:30px; color:#333; line-height:47px;  font-weight:normal; padding:0; position:relative;}
.i-news h2 span{ color:#C00; font-family: 'Playfair Display', serif; font-size:32px;}
.i-news h2 .more{ display:block; width:21px; height:21px;position:absolute; right:0; top:14px; }
.i-news h2 .more a{ display:block; width:21px; height:21px; background:url(../images/more-icon.png) no-repeat;}
.i-news h2 .more a:hover{ display:block; width:21px; height:21px; background:url(../images/more-icon.png) no-repeat 0 -21px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; }

.i-news ul{ list-style:none; padding:0; margin:0;}
.i-news ul li{ display:block; float:left; width:32.33%; margin:1% 0.5%;background:#f8f8f8; padding:1.5%; }

.i-news ul li .month{ float:left; width:80px; text-align:center; font-size:14px; color:#fff; font-weight:bold; background:#333333; padding:1%; margin:0 15px 0 0 ;}
.i-news ul li .month .date{ font-family:"Times New Roman"; font-size:30px; color:#fff; line-height:24px; }
.i-news ul li .month .year{ color:#FFF; font-size:14px; font-weight:normal; }

.i-news ul li .contect{ float:left; width:calc(100% - 95px); color:#4d4d4d; font-size:14px; height:100%;}
.i-news ul li .contect a{ color:#4d4d4d;}
.i-news ul li .contect a:hover{color:#3d8022;}

.i-news ul li .contect .contect-title{ color:#b21e28; font-size:16px; line-height:32px; padding:0 0 5px 0; height:32px; overflow:hidden; }
.i-news ul li .contect .brief{ height:39px; overflow:hidden;}





/***  首頁-關於我們  ***/
.i-about{ width:100%; margin:0 0 60px; padding:10px; background:#f9f8f8; border:1px solid #0192bf; border-radius:10px;}
.tableLayout{ display:flex; border-collapse: collapse; width: 100%;}
.i-about .tableLayout .intro-content{ background:url(../images/index-news-bg.jpg) no-repeat top right #FFF; width:50%; padding:60px 0; color:#666; font-size:16px; line-height:1.6;}
.i-about .tableLayout .intro-content .i-latest{ width:80%; margin:0 auto;}

.i-about .tableLayout .fig{ background:url(../images/knowledge-img.jpg) no-repeat top left; background-size:cover;}

.i-about-content{ background:#f9f8f8; width:50%; padding:10px 3%; color:#666; font-size:16px; line-height:1.8; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.movie{ width:50%; }
@media screen and (max-width:640px){
	.tableLayout{flex-wrap: wrap;}
	.i-about-content, .movie { width:100%; }
}
.i-about-content h2{ font-size:30px; color:#333; line-height:49px; font-weight:normal; padding:10px 0 0 0; position:relative; margin:0 0 3% 0;}
.i-about-content h2 span{color: #C00; font-family: 'Playfair Display', serif; font-size: 32px;}
.i-about-content .more{ text-align:center; font-size:13px; margin:20px 0 0 0; }

.i-about-content .more a{ display:block; width:70px;  background:#333333; color:#fff; padding:0 ; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.i-about-content .more a:hover{ display:block; width:80px; background:#89000a; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}

.color-blue{color:#3278d0; white-space:nowrap;}
.notice-box{font-size:14px; border:1px solid #f00; color:#f00; background-color:#fcc; padding:10px 20px; border-radius:5px; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms}
.notice-box:hover{background-color:#f00; color:#fff;}


/***  知識庫  ***/
.share-tool{ margin:15px 2% 10px 2%; color:#999;}
.share-tool img{ margin:0 0 0 6px;}



/** 常見問題 **/
.i-qa-extend{ background:url(../images/qa_bg.jpg) no-repeat top center;}
.i-qa{ max-width:1140px ; margin:0 auto; padding:3% 0 2.4% 0;}
.i-qa h2{ max-width:230px ; margin:0 auto; font-size:30px; color:#333; line-height:47px; font-weight:normal; padding:0 ; position:relative;}
.i-qa h2 span{ color:#C00; font-family: 'Playfair Display', serif; font-size:32px;}
.i-qa h2 .more{ display:block; width:21px; height:21px;position:absolute; right:1%; top:14px; }
.i-qa h2 .more a{ display:block; width:21px; height:21px; background:url(../images/more-icon.png) no-repeat;}
.i-qa h2 .more a:hover{ display:block; width:21px; height:21px; background:url(../images/more-icon.png) no-repeat 0 -21px; -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; }
.i-qa ul{ list-style:none; padding:20px 0 0 0; margin:0 0 20px 0;}
.i-qa ul li{ display:block; background:#fcfcfc; padding:15px ;  float:left; width:45%; margin:0.8% 2.5%;  line-height:24px; border-radius: 5px;box-shadow:3.5px 3.5px 2px 0px #999;}
.i-qa ul li a{  display:block;  color:#333; font-size:16px;}
.i-qa ul li a:hover{ display:block;  line-height:24px; color:#3278d0;}
.i-qa ul li i{ color:#C00; font-size:30px; margin-right:10px; vertical-align:middle; float:left; margin-top:-3px;}


/***** 訂單列表  *****/

.order-search { padding-left:30px;}
.order-list { padding-left:30px;} 
.order-list td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.order-list img.pro-photo { width:90px; height:90px; padding:10px; border:1px #CCC solid;}
.order-list .order-list-th { font-size:15px; color:#FFF; text-align:center; line-height:25px;}
.order-list .order-list-td { font-size:15px; color: #333; text-align: center;}
.order-list .price { font-size:15px; color:#900;}
.order-list .numb { font-size:15px; color: #788BAC; text-align:left;}
.order-list .numb a {color: #788BAC;}
.order-list .count { font-size:15px; color: #333;}
.order-list .count-portal { padding:10px 0; border-bottom:1px #CCC dotted; margin-bottom:20px;}
                     .count-price { font-size:24px; font-family:Verdana; color: #900; font-weight:bold;}
.order-list .portal { display:block; width:200px; font-size:15px; color:#900; float:right; text-align:right;}
.order-list .freight { display:block; width:150px; font-size:15px; color:#900; float:right; text-align:right;}
.oproject { display:none; color:#900;}


ul.order-list { list-style:none; margin:0 ; padding:0;}
ul.order-list li { border-bottom:1px #CCC dotted; padding:5px 0; }
ul.order-list li:nth-child(odd){ background: #F5F5F5;}
ul.order-list li.th { background: #666; color: #fff; text-shadow:-1px -1px 0 #333; padding:3px 0; -webkit-border-radius:  2px 2px 0 0; -moz-border-radius: 2px 2px 0 0; border-radius: 2px 2px 0 0; border:0;}
.th .order-list-img, .th .order-list-name, .th .order-list-price, .th .order-list-quantity, .th .order-list-subtotal, .th .order-list-del { padding-top:5PX; }

.order-list-img { float:left; width:10%; display:table-cell; font-size:15px; vertical-align:middle; text-align:center;}
.order-list-img02 { float:left; width:10%; display:table-cell; font-size:15px;  padding-top:5px; vertical-align:middle; text-align:center;}
  .sorder-list-img img { width:90px; height:auto; padding:5%; border:1px #CCC solid; margin:5%; text-align:center;}


.order-list-del a { color:#fff; padding:3px 10px; line-height:1.5em; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
background: rgb(248,80,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(248,80,50,1) 0%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 51%, rgba(240,47,23,1) 71%, rgba(231,56,39,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,80,50,1)), color-stop(50%,rgba(241,111,92,1)), color-stop(51%,rgba(246,41,12,1)), color-stop(71%,rgba(240,47,23,1)), color-stop(100%,rgba(231,56,39,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}

.order-list-del a:hover { 
background: rgb(255,48,25); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,48,25,1) 0%, rgba(207,4,4,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,48,25,1)), color-stop(100%,rgba(207,4,4,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
}


.order-ditaile-info { padding:0 0 0 40px; font-size:15px; color: #333; line-height:1.5em; }
.jump-window-box  { max-width:500px; margin:0 auto; border:1px #CCC solid; padding:20px; margin-top:20px;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}

/*** 會員登入  ***/
.member-login-box { max-width:500px; margin:0 auto; border:1px #CCC solid; padding:20px; margin-top:20px;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}


/*****  購物車  *****/
.cart-body { max-width:1140px; margin:0 auto;}
.shopping-car { padding-left:30px;} 
th.shopping-car-th { background: #69C; font-size:15px; color:#FFF; text-align:center; line-height:25px;  border-right:1px #fff dotted;} 
.shopping-car td { text-align:center; font-size:12px; line-height:1.5em; padding:5px 10px; border-bottom:1px #CCC dotted; border-right:1px #CCC dotted;}
.shopping-car img.pro-photo { width:90px; height:90px; padding:10px; border:1px #CCC solid;}
.shopping-car .pro-name { font-size:15px; color: #333; text-align:left;}
.shopping-car .price { font-size:15px; color:#900;}
.shopping-car .numb { font-size:15px; color: #66F;}
.shopping-car .count { font-size:15px; color: #333;}
.shopping-car .count-portal { padding:10px 0; border-bottom:1px #CCC dotted; margin-bottom:20px;}
                     .count-price { font-size:24px; font-family:Verdana; color: #900; font-weight:bold;}
.shopping-car .portal { display:block; width:200px; font-size:15px; color:#900; float:right; text-align:right;}
.shopping-car .freight { display:block; width:150px; font-size:15px; color:#900; float:right; text-align:right;}



ul.shopping-car-list { list-style:none; margin:0 ; padding:0;}
ul.shopping-car-list li { border-bottom:1px #CCC dotted; padding:5px 0; }
ul.shopping-car-list li.th { background: #777; color: #fff; text-shadow:-1px -1px 0 #393939;  min-height:0px; padding:5px 0; border:0; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0;}
.th .shop-car-img, .th .shop-car-name, .th .shop-car-price, .th .shop-car-quantity, .th .shop-car-subtotal, .th .shop-car-del { padding-top:5PX; }

.shop-car-img { display:table-cell; font-size:15px; vertical-align:middle; text-align:center;}
  .shop-car-img img { width:90px; height:auto; padding:5%; border:1px #CCC solid; margin:5%; text-align:center;}
.shop-car-name { display:table-cell; padding-top:50PX;  font-size:15px; vertical-align:middle; text-align:center;} 
.shop-car-price {  display:table-cell; padding-top:50PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-quantity { display:table-cell; padding-top:50PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-subtotal{  display:table-cell; padding-top:50PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-del {  display:table-cell; padding-top:50PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-del a { color:#fff; padding:3px 10px; line-height:1.5em; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
background: rgb(248,80,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(248,80,50,1) 0%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 51%, rgba(240,47,23,1) 71%, rgba(231,56,39,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,80,50,1)), color-stop(50%,rgba(241,111,92,1)), color-stop(51%,rgba(246,41,12,1)), color-stop(71%,rgba(240,47,23,1)), color-stop(100%,rgba(231,56,39,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}
.shop-car-del a:hover { 
background: rgb(255,48,25); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,48,25,1) 0%, rgba(207,4,4,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,48,25,1)), color-stop(100%,rgba(207,4,4,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(255,48,25,1) 0%,rgba(207,4,4,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff3019', endColorstr='#cf0404',GradientType=0 ); /* IE6-9 */
}

.shopping-car .oproject { font-size:15px; color:#000; display:none; font-weight:bold; }


.checkout-box { background:#eee; padding:10px; margin-left:30px; border-bottom:2px #FFF dotted;}
.checkout-box h3 { background: #999; border-left:5px #333 solid; font-size:18px; color:#fff; text-shadow:-1px -1px 0 #666; line-height:30px; padding-left:20px; font-weight:500;}
.check-box { padding:5px; font-size:15px; color:#000;}
.check-box a { color:#000;}
.check-box a:hover { color:#960; } 

.appointment { max-width:600px; margin:0 auto;}
.appointment-title { text-align:center;}

/*****  產品專區  *****/
.search { padding:0 10px;}
.search-input { padding:10px 0; position:relative;}
.search-input img { position:absolute; right:0; top:10px;}
.search input { background: #e8d5d5; font-size:15px; color: #737946; padding:5px 0 5px 5%; line-height:31px; height:31px; width:85%; 
                -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; border:0; margin:0 10% 0 0; right:70px; vertical-align:middle;}
.search img { vertical-align:middle;}

.pro-store-info { font-size:13px; line-height:1.5em; color:#666; padding:10px 0 10px 35px; border-bottom:1px #CCC dotted; margin-bottom:20px;}
.pro-search-info { font-size:18px; color:#64691F; line-height:1.5em; border-bottom:1px #CCC dotted; margin-bottom:20px; text-align:center; padding-bottom:10px;}

.pro-list {}
.pro-list ul { display:flex; flex-wrap:wrap; max-width:1140px; margin:0 auto; padding:0; list-style:none;}
.pro-list ul li { position:relative; margin:0 1% 30px; width:23%; padding:0; text-align:center; float:left; border:10px solid #fff; border-radius:5px; overflow: hidden;}
.pro-list ul li:hover { border:10px solid #cae1fc; }
.pro-list ul li h4 { display:flex; position:absolute; width:100%; bottom:0;  line-height:1.5em; font-weight:normal; padding:0; margin:0; max-height:3em; overflow:hidden; text-align:center; vertical-align:middle; }
.pro-list ul li h4 a{display:inline-block; background-color:rgba(231, 243, 255, .85); padding:5px 10px; width:100%; text-align:center; color:#3278d0; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.pro-list ul li:hover h4 a{background-color:rgb(50, 120, 208); color:#fff; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}


.pro-photo { background:#000; width:100%; position: relative;}
.pro-photo a {}
.pro-list ul li .pro-photo img.index-pro-img { width: auto; height: auto; flex-shrink:0; transform:scale(1); -webkit-transition:all 0.3s ease; -moz-transition:all 0.3s ease; -ms-transition:all 0.3s ease; -o-transition:all 0.3s ease; transition:all 0.3s ease; opacity:1;}
.pro-list ul li:hover .pro-photo img.index-pro-img { background-color:#000; transform:scale(1.2); opacity:.9; }



.pro-list ul li .index-pro-store {color:#938c83; line-height:1.5em; padding:10px 0; display:block;;}
.pro-list ul li .index-pro-price { color:#b83400; font-size:18px; padding:0 0 10px 0; display:block; }
.pro-list ul li a.cart { padding:3px; color: #7E7E7E;  font-size:15px; display:block; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px #DCDCDC solid;}
.pro-list ul li a.cart img { padding-right:20px; vertical-align:middle;}
.pro-list ul li a.cart:hover { background: #fff; border:1px #eee solid;}


.pro-detaile { padding-left:30px; }
h3.pro-detaile-title { border-bottom:1px #CCC dotted; font-size:20px; color:#333; line-height:30px; margin-bottom:20px; padding-bottom:10px; font-weight:normal;}
.pro-detaile .pro-photo {background:#fff; width:100%; margin:0 0 10px 0; padding:0 15px 0 0; border:0;}
.pro-detaile .pro-photo img { width:auto; max-width:100%; height:auto; max-height:500px;}
.pro-specification {  font-size:15px; line-height:1.7em; color:#333; position:relative; padding:10px 5px; margin-bottom:10px;}
.pro-specification p { margin:}
.pro-content { padding:0px 0; font-size:15px; line-height:1.5em; color:#333; clear:both;} 
.pro-content p.spec { margin:0; padding:0; font-size:12px; line-height:1.5em; color:#333;}

h3.pro-introduce { font-weight:normal; padding:5px 5px; margin:20px 0 40px 0; font-size:18px; border-bottom:1px solid #DDD;}
h3.pro-introduce span{ background:#C00; color:#FFF; padding:5px 20px; -webkit-border-radius: 3px 3px 0 0; -moz-border-radius: 3px 3px 0 0; border-radius: 3px 3px 0 0; }

.pro-qr-code {}
.pro-qr-code img { width:100px; height:auto;}
.cart-info { vertical-align:middle; }
.cart-info .price { font-size:28px; font-weight:bold; color: #F00;  vertical-align:middle; display:block;}
.cart-info .quantity { font-size:16px; color: #333;  vertical-align:middle; display:block; text-align:right; padding:10px 0; line-height:30px;}
.cart-info .quantity select { line-height:25px;}
 .check-out { text-align:center;  vertical-align:middle; display:block;}
 .check-out a {display:block; vertical-align:middle;  font-size:13px; min-width:130px; color:#333; padding:5px 10px; margin:10px 0; text-shadow:-1px -1px 0 #fff;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; background: #FFF; border:1px #D4D4D4 solid;}	
 			  
 .check-out a:hover { background: #D4D4D4;  text-shadow:-1px -1px 0 #A2A2A2; color:#333;}
 .check-out a img { vertical-align:middle; margin-right:10px;}
.cart-btn { padding:15px 0 10px 0; text-align:center; margin-top:15px;  }



/**** 產明細圖片特效樣式 ****/
.slider-wrap								{ width: 100%;}	
.stripViewer .panelContainer		        { width: 400% !important;}	
.stripViewer .panelContainer  .panel ul		{ text-align: left; margin: 0 15px 0 30px; width: 100%}
.stripViewer								{ position: relative; overflow: hidden; width:100%; height: auto; }
.stripViewer .panelContainer				{ position: relative; left: 0; top: 0; width:400%; }
.stripViewer .panelContainer .wrapper       { width:100%;}
.stripViewer .panelContainer img            { width:100%; height:auto;}
.stripViewer .panelContainer .panel			{ float: left; position: relative;}
.stripNavL, .stripNavR, .stripNav			{ display: none; width:100%; }
.nav-thumb 									{ margin-right: 5px; }
#movers-row									{ margin:5px 0 0 0; width:101%; }
#movers-row div								{ width: 25%; float: left; padding-right:1%; }
#movers-row div a.cross-link 				{ float: right; }
.photo-meta-data							{ background: url(/html/ezcatfiles/myweb62/img/img/60175/transpBlack.png); padding: 10px; height: 30px; 
											  margin-top: -50px; position: relative; z-index: 9999; color: white; }
.photo-meta-data span 						{ font-size: 13px; }
.cross-link									{ display: block; margin-top: 0px; position: relative; padding-top: 0px;}
.active-thumb 								{ background: transparent url(/html/ezcatfiles/myweb62/img/img/60175/icon-uparrowsmallwhite.png) top center no-repeat; }
.panel { width:25%;} /**四張圖 乘 四分之一 **/



/*****  聯絡我們  *****/
.contact-body { padding:0 1% 0 1%;}
.contact-note { background:#d6000f url(../images/footer-bg.png) ; padding:10px; font-size:15px; color:#FFF; text-align:center; margin-bottom:15px;}

.contact-left { }
.contact-left img { width:100%; height:auto; margin-top:10px; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.btn-send { font-size:13px;} 
a.btn-send { background: #e72330; padding: 5px  20px; text-align:center; font-size:15px; color:#fff; width:100px; margin:2px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
a.btn-send:hover { background: #ef535e;}
a.btn-reset { background:#e72330;  padding: 5px 20px; text-align:center; font-size:15px; color:#fff; width:100px; margin:2px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
a.btn-reset:hover { background:#ef535e;}


a.btn-send-over { background: #79919F; padding: 3px  20px; text-align:center; font-size:15px; color:#fff; width:100px; margin:2px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
a.btn-send-over:hover { background: #63AEBD;}

img.code { width:100px; height:32px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin:0 5px; vertical-align:middle;}


.contact-infor{ width:96%; margin:0 auto; }
.contact-infor img{ margin-right:8px;}


/* 聯絡我們頁籤 */
.content-box{margin: 30px 2%;}
.content-box .infor{ width:50%; margin-right:2%; float:left;}
.content-box .infor h3{ color:#C00; margin:10px 0 0 0; font-weight:normal; font-size:16px;}
.content-box .map{ width:48%; float:left; margin:0 0 5px 0; }

  #location{ height:auto; background-color:#eee;  font-family:"微軟正黑體";}
  #location ul{  list-style:none;  height:auto; margin:0;  padding:0;}
  #location ul li{ font-family:"微軟正黑體"; text-align:center; line-height:20px;  width:auto;  cursor:pointer;  background-color:#EEE;  float:left; font-size:13px;  padding:5px 2% 3px 2%; font-weight:bold; color:#666; font-size:15px; margin-right:3px;}
  #location ul li:hover, #location ul li.active{ background:#e72330;  color:#FFF;  font-family:"微軟正黑體"; }

  #location-info{  width:auto; color:#000; font-size:30px;  font-weight:bold;  clear:both;border:2px solid #e72330; background:#FFF; margin-bottom:20px;}
  #location-info>.box{  width:auto;  height:auto;  display:none;}
  #location-info>.box table{ background:#55BCFF;}
   @media only screen and (max-width: 400px) {
     #location-info>.box table tr td img{ width:90%;}
}
  #location-info .time-box{ margin:10px 0;}
  #location-info .link{ display:block; float:left; padding:15px 25px 20px 0; }
  #location-info .link img{ margin-right:5px;}
  #location-info .link a{ color:#515151; text-decoration:none;}
  #location-info .link a:hover{ color:#36C; }

  .box.b1{ font-size:15px; font-weight:normal; padding:15px 2%; color:#515151; line-height:26px;}
  .box.b2{ font-size:15px; font-weight:normal; padding:15px 2%; color:#515151; line-height:26px;}
  .box.b3{ font-size:15px; font-weight:normal; padding:15px 2%; color:#515151; line-height:26px;}
  .box.b4{ font-size:15px; font-weight:normal; padding:15px 2%; color:#515151; line-height:26px;}



/*****  FAQ  *****/
.faq { margin:40px 0; padding: 0 2%;}
.faq ul { margin:0; padding:0; list-style:none;}
.faq ul li { border-bottom:1px #fff solid; margin-bottom:10px; }
.faq ul li .qa_title {  font-weight:normal;  }
.faq ul li .qa_title>a { color:#444; font-size:16px; display:block; padding:10px 0 10px 10px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; border:1px solid #CCC; position:relative;}
.faq ul li .qa_title>a:before{ content:" "; display:block; position:absolute; left:0; top:0; background:#C00; width:42px; height:100%; z-index:-1;}
.faq ul li .qa_title>a i{ color:#FFF; font-size:26px; margin:-3px 15px 0 0; float:left;}
.faq ul li .qa_title>a span{ padding:3px 5px 0 3px; display:inline;}


.faq ul li .qa_content {background: rgba(90%,90%,90%,0.3); padding:10px 15px 15px 20px; font-size:15px; line-height:1.5em; color:#666; border:0px solid #d8ecb6;}
.faq ul li .qa_content a{ background:#b9010e; color:#FFF;  padding:3px 7px;}


.opacl { font-size:12px; line-height:20px; padding-bottom:10px; }
.opacl a { background: #888888; color:#fff; padding: 3px 10px; margin:0 5px; -webkit-border-radius: 5px 5px 0 0px; -moz-border-radius: 5px 5px 0 0px; border-radius: 5px 5px 0 0px;}
.opacl a:hover { background:#699;}
a.close_qa { font-size:12px;} 
#qaContent{}
.accordionPart{}




/*** 行銷支援服務 ***/
.sell{ max-width:1140px; margin:0 auto 50px auto;}
.sell h2{ color:#b21e28; font-size:17px; line-height:30px; padding:0 0 5px 0; margin:0; font-weight:normal; }

.sell ul{ list-style:none; padding:0; margin:0;}
.sell ul li{ display:block; width:99%; margin:20px 0.5%; box-shadow:4px 4px 1px #ebd9db; position:relative;border-left:4px solid #C00;  background: #f8f8f8;}
.sell ul li:hover{background:#ffebeb;}

@media screen and (max-width: 1140px) {
	.sell ul li{  width:96%; margin:20px auto; }
} 



.sell ul li a{display:block;    }



.sell ul li .contect{  float:left; width:100%; color:#4d4d4d; font-size:14px; position:relative; padding:20px 1.7% 20px 3%;}
.sell ul li .contect:after{ content:" "; position:absolute; right:-5px; top:0;
width: 0;
height: 0;
border-style: solid;
border-width: 0 30px 30px 0;
border-color: transparent #Fff transparent transparent;
}
.sell ul li .contect a{ color:#4d4d4d;}
.sell ul li .contect a:hover{color:#3d8022;}

.sell ul li .contect .contect-title{ color:#b21e28; font-size:16px; line-height:30px; padding:0 0 5px 0; }


/*****  內頁架構  *****/
.content-body {max-width:1140px; margin:0 auto; padding:0 0 50px 0; min-height:350px; }
.page-title { font-size:32px; color:#333; padding:0; line-height:30px; margin:25px 0;  text-align:center; font-weight:normal; font-family: 'Playfair Display', serif; color:#d6000f; }
.page-title span{ font-family:"微軟正黑體", Arial; font-size:27px; padding:0 0 0 20px; margin:0 0 0 15px; color:#444; position:relative;}
.page-title span:before{ display:block; content:"/"; position:absolute; left:0; bottom:5px; font-size:24px; color:#d6000f;}

.page-title img{ margin-right:15px;}
.theme-title{ font-size:22px; border-bottom:1px dashed #e5bebe; font-weight:normal; color:#666; padding:5px 0 10px 5px; line-height:26px; margin:0;}
.theme-title span{ display:block; padding:0 0 0 33px;}
.theme-title i{ color:#d6000f; padding:3px 10px 0 0; font-size:22px; float:left;}
.theme-title-02{ background:url(../images/theme-title-bg-02.png) no-repeat 4px 6px ; font-size:22px; border-bottom:1px dashed #e5bebe; font-weight:normal; color:#666; padding:5px 0 10px 42px; line-height:30px; margin:0;}



.service-sort{ font-size:20px; font-weight:normal; text-align:center; position:relative; padding:0 0 15px 0; margin:10px 0 50px 0;}
.service-sort:after{content: ""; position: absolute; left: 50%; bottom: 0; width: 50px; height: 1px; background:#C00;margin-left: -25px;}

.page-main { padding: 0 1.5%; font-size: 16px; color:#333; line-height:1.65em;  }

.left-menu-title { background: #909090; text-align:center; font-size:18px; color: #fff; text-shadow:-1px -1px 0px #666;   padding:5px 0 10px 0; border-top:1px #999 dotted;  
                   -webkit-border-radius:0 0 5px 0px; -moz-border-radius:0 0 5px 0px; border-radius:0 0 5px 0px;}
				   
.in-left-menu { margin-bottom:45px; }
.in-left-menu>ul { margin:0; padding:0; list-style:none; display:table; width:100%; text-align:center;}
.in-left-menu>ul>li  { font-size:15px; color:#666; padding:5px 0; display:inline-table; margin:0 5px;}
.in-left-menu>ul>li>a { color:#333; display:block; padding:3px 10px; line-height:1.5em; border:1px solid #DDD; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms; position:relative;}
.in-left-menu>ul>li>a:hover { background:#d6000f; border:1px solid #333333; color:#FFF; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.in-left-menu>ul>li>a.active{background:#333333; border:1px solid #333333; color:#FFF;}
.in-left-menu>ul>li>a.active:after{content: " "; width: 0px; height: 0px; border-style: solid; border-width: 5px 7.5px 0 7.5px; border-color: #333333 transparent transparent transparent; position: absolute; bottom: -6px;
left: 50%;margin-left: -7.5px;}


.in-left-menu>ul>li ul { margin:5px 0 0 40px; padding:0; list-style: square;} 
.in-left-menu>ul>li ul li { border-top:1px #CCC dotted; padding:5px;}
.in-left-menu>ul>li ul li:hover { background: #E8E8E6;} 
.in-left-menu>ul>li ul li a { font-size:13px; color:#666; display:block;}
.in-left-menu>ul>li ul li a:hover { color: #71743D;  }


/** 左邊展開選單 **/
.sample1 {font:15px/22px "微軟正黑體";  color:#666;}
.sample1 h2 {font:15px/22px "微軟正黑體";  color:#666; padding:0; color:#b3981c; margin:0; }

.sample1>ul { margin:0; padding:10px 0 0px 0; list-style:none;  }
.sample1>ul>li  { font-size:15px; color:#666; padding:5px 0; list-style:none; position:relative;}
.sample1>ul>li>a { color:#333; display:block; padding:3px 10px; line-height:1.5em; border:1px solid #DDD; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms; position:relative;}
.sample1>ul>li>a:hover { background:#333333; border:1px solid #333333; color:#FFF; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms; }
.sample1>ul>li>a { background-color:#dedede; color:#333; display:block; padding:3px 10px; line-height:1.5em; border:1px solid #fff; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms; position:relative;}
.sample1>ul>li>a:hover { background:#333333; border:1px solid #333333; color:#333; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms; }
.sample1>ul>li>a.active{background:#333333; border:1px solid #333333; color:#FFF;}
.sample1>ul>li>a.active:after{content: " "; width: 0px; height: 0px; border-style: solid; border-width: 5px 7.5px 0 7.5px; border-color: #333333 transparent transparent transparent; position: absolute; bottom: -6px;
left: 50%;margin-left: -7.5px;}

.sample1>ul>li>.sub-menu{ list-style:none; margin:8px 0 0 0; position:absolute; left:50%; top:33px; margin-left:-60px; width:120px; border:1px solid #EEE; background:#EEE; z-index:999;  opacity: 0; transition: 300ms; -moz-transition: 300ms; -webkit-transition: 300ms; height:0; overflow:hidden; }
.sample1>ul>li:hover>.sub-menu{ display:block; border:1px solid #DDD; opacity: 1; transition: 300ms; -moz-transition: 300ms; -webkit-transition: 300ms; height:auto; }
.sample1>ul>li>.sub-menu>li{ border:0; padding:3px 0; font-size:14px;}
.sample1>ul>li>.sub-menu>li>a{ padding:0 5px;}
.sample1>ul>li>.sub-menu>li>a:hover{ color:#C00;}

.sample2 { border-bottom:1px #ccc dashed; margin:0 0 0 15px; padding:0;}


.service-sub-menu{ width:94%; margin:0 auto 20px auto; clear:both; border:1px solid #EEE; display:none;}
.service-sub-menu select{background: rgba(90%,70%,70%,0.3); width: 100%; border: 0; margin: 0; padding: 7px 2%; font-size: 14px; font-family: "微軟正黑體"; color: #4E4E4E; line-height: 20px;}
.service-detaile{ margin:30px 0;}



/*** 消息 ***/
.news{ max-width:1140px; margin:0 auto 50px auto;}
.news h2{ max-width:260px ; margin:0 auto 15px auto; background:url(../images/news-title_bg.png) no-repeat left center; font-size:30px; color:#333; line-height:47px; text-align:center; font-weight:normal; padding:0 0 0 55px; position:relative;}

.news ul{ list-style:none; padding:0; margin:0;}
.news ul li{ display:block; float:left; width:49%; margin:1% 0.5%;background:#f8f8f8; padding:1.5%; position:relative; height:132px; overflow:hidden; }
.news ul li>a{ display:block; height:100%;}
.news ul li:hover{ box-shadow:0 0 5px #999; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}

.news ul li .month{ float:left; width:100px; text-align:center; font-size:14px; color:#fff; font-weight:bold; background:#333333; padding:16px 1%; margin:0 15px 0 0 ;}
.news ul li .month .date{ font-family:"Times New Roman"; font-size:30px;  line-height:24px; }
.news ul li .month .year{  font-size:14px; font-weight:normal; }

.news ul li .contect{ width: 100%; color: #4d4d4d; font-size: 14px; padding-left: 120px; height:100%; }
.news ul li .contect a{ color:#4d4d4d;}
.news ul li .contect a:hover{color:#3d8022;}

.news ul li .contect .contect-title{ color:#b21e28; font-size:16px; line-height:30px; padding:0 0 5px 0; }

.news-detaile{ margin:30px 0; padding:0 2%;}
.news-detaile .time{ font-size:14px; color:#d16b73;}





/*** 流程服務 ***/
.process{ margin:0 2%;}
.process ul.pc{ list-style:none; margin:0; padding:0;}
.process ul.pc li{ display:inline-table; text-align:center; width:16.4%; margin-bottom:60px; position:relative; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
.process ul.pc li img{ height:68px; width:auto;}
.process ul.pc li .process-title{ text-align:center; margin-top:10px; font-size:19px;}
.process ul.pc li:after{ content: " "; position:absolute; right:-12px; top:50%; margin-top:-17px;
width: 0;
height: 0;
border-style: solid;
border-width: 17.5px 0 17.5px 15px;
border-color: transparent transparent transparent #999;
}
.process ul.pc li.last:after{ display:none;}

@media screen and (max-width: 1150px) {
	.process ul.pc li{ width:19.5%; transition: 500ms; -moz-transition: 500ms; -webkit-transition: 500ms;}
} 

@media screen and (max-width: 750px) {
	.process ul.pc li{ width:24%; }
}



.process ul.mobi{ list-style:none; margin:0 5%; padding:0; display:none;}
.process ul.mobi li{ margin-bottom:30px; text-align:center; border:1px solid #900; font-size:20px; height:69px; line-height:62px; position:relative;}
.process ul.mobi li img{ width:50px; margin-right:30px;}
.process ul.mobi li.last img{ margin-right:20px;}
.process ul.mobi li:after{content: " "; position:absolute; left:50%; margin-left:-15px; bottom:-22px;
width: 0;
height: 0;
border-style: solid;
border-width: 12px 15px 0 15px;
border-color: #999 transparent transparent transparent;
}
.process ul.mobi li.last:after{ display:none;}





/*****  首頁產品  *****/
.index-pro { max-width:1140px; margin:0 auto;}
.index-pro-title {font-size:24px; color:#333; line-height:30px; padding-bottom:10px; text-align:center; font-weight:normal; border-bottom:3px #DFDFDF solid;} 
.index-pro ul { max-width:1140px; margin:0 auto; padding:0; list-style:none;}
.index-pro ul li {  width:20%; padding:1%; text-align:center; float:left;}
.index-pro ul li:hover { background:#f8f6f6;}
.index-pro ul li h4 { font-size:15px; color:#504f4d; line-height:1.5em; font-weight:normal; padding:5px 0 5px 0; margin:0; }

.index-pro ul li .index-pro-store {color:#938c83; line-height:1.5em; padding:10px 0; display:block; }
.index-pro ul li .index-pro-price { color:#b83400; font-size:18px; padding:0 0 10px 0; display:block; }
.index-pro ul li a.cart { padding:8px; color:#333; font-size:15px; display:block; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border:1px #DBDBDB solid; }
.index-pro ul li a.cart img { padding-right:20px; vertical-align:middle;}
.index-pro ul li a.cart:hover { background: #EDEDED;}
.index-more { max-width:1140px; border-top:1px #dad0d0 solid; margin:50px auto 0 auto; height:50px; position:relative; }
.index-more a { background:url(../images/index-more-pro.png) no-repeat; color:#a7a7a7; width:132px; height:36px; display:block; margin:0 auto; text-align:center; position:absolute; top:-10px; left:50%; margin-left:-66px;}


/*****  首頁連結  *****/
.index-link { max-width:1140px; margin:0 auto;}
.index-link h3 { color:#333; font-size:36px; font-weight:normal; text-align:center; line-height:0.8em; letter-spacing:2px;}
.index-link h3 .red { color:#d45500; font-size:24px; letter-spacing:0px;}
.index-link h3 .brwon { color:#c2ab8a; font-size:24px; padding-left:15px; letter-spacing:0px;}

.index-link-top { height:75px;}

.index-link ul { background:#e1e1e1; margin:0; padding:0; list-style:none;}
.index-link ul li { float:left; width:25%; margin:0; padding:0; border:1px  #fff dotted;}
.index-link ul li img { width:100%; height:auto; border:0; margin:0; padding:0;}


/*****  首頁 搜尋 最新消息模組  *****/
.index-news { width:100%; position:relative;}
.index-news-line { position:absolute; width:100%; border-bottom:1px #d1d1d1 solid; top:50px; z-index:-1; }

.index-search-news { max-width:1140px; margin:0 auto;}
.index-search { }
.index-search h3 { font-size:24px; color:#333; font-weight:normal; line-height:40px; margin:10px 0 10px 0; padding:0; }
.index-search span { display:block; float:right; font-size:15px; color:#d1d1d1; font-weight:normal;}
.index-search-input { padding:10px 0 20px 0; position:relative; color:#333;}
.index-search-input img { position:absolute; right:0; top:10px;}
.index-search input { background: #e8d5d5; font-size:15px; color: #333; padding:5px 0 5px 20px; line-height:21px; width:100%; -webkit-border-radius: 5px 0 0 5px; -moz-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; border:0; margin:0 5% 0 0; right:51px; vertical-align:middle;}
.index-search img { vertical-align:middle;}



/***  會員登入  ***/
h3.login-title { margin:10px 0 10px 0; font-family:"Times New Roman"; font-size:30px; line-height:30px; color:#9B9B9B;}
.login-tool {}
.icon-tool { width:40px; height:auto; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.member-signup { font-size:14px; color:#828282; line-height:20px; padding:5px 0; text-align:center;}
.calender { width:30px; height:auto;}


/***  版面欄位  ***/
.main { padding-top:0px;}
.col-100 {float:left; width:100%;}
.col-010 { width:9%; margin-right:1%; float:left;}
.col-015 { width:14%; margin-right:1%; float:left;}
.col-020 { width:19%; margin-right:1%; float:left;}
.col-025 { width:24%; margin-right:1%; float:left;}
.col-030 { width:29%; margin-right:1%; float:left;}
.col-040 { width:39%; margin-right:1%; float:left;}
.col-045 { width:44%; margin-right:1%; float:left;}
.col-050 { width:49%; margin-right:1%; float:left;}
.col-055 { width:54%; margin-right:1%; float:left;}
.col-060 { width:59%; margin-right:1%; float:left;}
.col-065 { width:64%; margin-right:1%; float:left;}
.col-070 { width:69%; margin-right:1%; float:left;}
.col-075 { width:74%; margin-right:1%; float:left;}
.col-080 { width:79%; margin-right:1%; float:left;}
.col-085 { width:84%; margin-right:1%; float:left;}

.cor-010 { width:10%; float:left;}
.cor-015 { width:15%; float:left;}
.cor-020 { width:20%; float:left;}
.cor-025 { width:25%; float:left;}
.cor-030 { width:30%; float:left;}
.cor-035 { width:35%; float:left;}
.cor-040 { width:40%; float:left;}
.cor-045 { width:45%; float:left;}
.cor-050 { width:50%; float:left;}
.cor-055 { width:55%; float:left;}
.cor-060 { width:60%; float:left;}
.cor-065 { width:55%; float:left;}
.cor-070 { width:70%; float:left;}
.cor-075 { width:75%; float:left;}



/*** 關於我們 ***/
.about{ margin:0 2% 30px 2%;}
.about h3{ font-size:22px; font-weight:normal; margin:20px 0 8px 0; color:#444;}
.about hr{ width:24px; border:0; border-bottom:1px solid #C00; margin:0 0 30px 0; float:left;}

.about-history{  padding:15px 0; clear:both; margin-bottom:40px; position:relative; }
.about-history .image-box{ position:absolute; max-width:35%; top:0; right:0;}
.about-history .image-box img{ width:100%; margin:10px 0; box-shadow:0 0 10px #CCC;}
.history .event-list{background:url(../images/year-line.png) repeat-y 8px bottom; padding:10px 0; max-width:62%; min-height:450px;}
.history .event-list ul{ margin:0; padding:0; list-style:none;}
.history .event-list ul li{ margin-bottom:10px;}
.history .event-list ul li .year{ background:#C00; width:58px; padding:1px 0; font-size:14px; text-align:center; color:#FFF; font-weight:bold; float:left; position:relative; margin-left:30px; }
.history .event-list ul li .year:before{ content:""; position:absolute; top:0; left:-10px; width: 0;
height: 0;
border-style: solid;
border-width: 13px 10px 13px 0;
border-color: transparent #C00 transparent transparent;}
.history .event-list ul li .event{ padding:3px 3px 5px 110px;}

.about .content{ clear:both;}


/*** 訂位填寫  ***/
.show-date { background:#14A1F0; padding:5px 10px; font-size:14px; color:#fff; line-height:25px; margin-bottom:5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
.show-date a { color:#D0FF00; text-decoration:none;}
.show-date a:hover { color:#F0FF9B;}
.kyein-be-member { background: #FF1115; padding:5px 10px; font-size:14px; color: #FFDADA; line-height:25px; margin-bottom:5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}


/*** 訂位區塊  ***/
.info-box { font-size:14px; color: #686868; line-height:20px; padding-bottom:10px; margin-bottom:10px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}
h4.info-title { background: #FFEDED; font-size:17px; line-height:30px; color: #AD3A3C; padding: 0 0 0 10px; margin:5px 0px 10px 0px;  -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-weight:normal;}
.info-content { padding:0 0 10px 20px;}
.info-content ul { list-style:square; margin:0 0 0 0px; padding:0 0 0 20px;}
.info-content ul li { border-bottom:1px #BFBFBF dotted; margin-bottom:10px; color: #A41C1F;}
.info-content ul li p { font-size:12px; color:#767676; margin:0 0 10px 0; padding:0;}
h5.info-set-opint { color:#69B7FF; font-size:15px; line-height:25px; border-bottom:1px #D9D9D9 solid; margin:0 0 10px 0;}

/***  step  ***/
.step { list-style:none; margin:0; padding: 20px 0;}
.step li { float:left; width:25%; font-size:28px; line-height:1.2em; color:#D9D9D9; border-left:1px #D9D9D9 solid; padding:0px 0; text-align:center;}
.step li.active , .step li.active span { color: #0091ED;}
.step li span { color:#7F7F7F; display:block; font-size:15px; line-height:18px; padding: 5px 0 0 0px; border-top:1px #DBD8D8 dotted; margin:10px auto 0 auto; width:80%;}



/***  歷史訂單  ***/
.table-border { background: #DBDBDB; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom:10px;}
.table-border th {  font-size:14px; color:#fff; padding:3px 5px;}
.table-border td { font-size:14px; color: #515151; padding:3px 5px; text-align:center; }

.table-border tr:first-child { background:#FF6700; font:12px; padding:3px 5px; -webkit-border-radius:5px 5px 0 0; -moz-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0;}
.table-border tr:last-child { background:#FFF; font:12px; padding:3px 5px; -webkit-border-radius:0 0px 5px 5px; -moz-border-radius:0 0px 5px 5px; border-radius:0 0px 5px 5px;}
.table-border tr:nth-child(2n){ background:#FFF; }
.table-border tr:nth-child(2n+3){ background:#FFFBF0; }



/***  表單欄位  ***/
.form-box {background: rgba(100%,100%,100%,0.6); padding:4% 7%; box-shadow: 0 0 8px #999; margin: 30px 2%; }
.form-box input, .form-box img { vertical-align:middle;}
.form-style01 { font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; padding:5px 0 10px 0; line-height:20px; width:100%;}

.opinion { padding:10px 0; border-bottom:1px dashed #DDD;}
.opinion-left01 { background:none; float:left; width:30%;  border-right:0; padding:7px 2%; font-size:16px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px;
                  -webkit-border-radius:5px 0px 0px 5px; -moz-border-radius:5px 0px 0px 5px; border-radius:5px 0px 0px 5px;}
				  
.opinion-right01 { float:left; width:7.5%; border:1px #CBCBCB solid; padding:0px 2%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px; border-left:0;
                  -webkit-border-radius:0 5px 5px 0; -moz-border-radius:0 5px 5px 0; border-radius:0 5px 5px 0;}
				  
.input-main-style01 { float:left; width:55%; border:1px #CBCBCB solid; margin:0; padding:5px 2%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px;
                      -moz-box-shadow:0px 0px 5px #E9E9E9 inset;              /* For Firefox3.6+ */
	                  -webkit-box-shadow:0px 0px 5px #E9E9E9 inset;           /* For Chrome5+, Safari5+ */
	                  box-shadow:0px 0px 5px #E9E9E9 inset;                   /* For Latest Opera */
				      }
.input-main-style02 {background: rgba(90%,90%,90%,0.3); float:left; width:70%; border:0; margin:0; padding:7px 2%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px;}			
.input-main-style03 { float:left; width:93.3333%; border:1px #CBCBCB solid; margin:0; padding:2px 1.5%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px; text-align:center;
                     -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;
 }						 
					 
.select-style { font-size:15px; color:#666; line-height:20px; padding:5px 10px;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }

.order-numb { color:#FF0004;}

/***  輸入欄位  ***/

input { }
.input-style01 { background: rgba(90%,90%,90%,0.3); border:0; padding:5px 2%; line-height:20px; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; width:70%; }

.input-botton01 { border:1px #CBCBCB solid; padding:5px 2%; line-height:18px; font-size:13px; font-family:"微軟正黑體"; color:#4E4E4E; width:100px; margin:0 auto; text-align:center; 
                  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin-bottom:5px; text-shadow: 1px 0px #fff; font-weight:800;}

.select-style01 {border:1px #CBCBCB solid; padding:5px 2%; width:99%; line-height:20px; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; margin:0;
                 -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;
                 -moz-box-shadow:0px 0px 5px #E9E9E9 inset;              /* For Firefox3.6+ */
	             -webkit-box-shadow:0px 0px 5px #E9E9E9 inset;           /* For Chrome5+, Safari5+ */
	             box-shadow:0px 0px 5px #E9E9E9 inset;                   /* For Latest Opera */}

.input-botton-blue {
background: #feffff; /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZlZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjM1JSIgc3RvcC1jb2xvcj0iI2UyZmVmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM5ZWVkZTYiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  #feffff 0%, #e2feff 35%, #9eede6 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feffff), color-stop(35%,#e2feff), color-stop(100%,#9eede6)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #feffff 0%,#e2feff 35%,#9eede6 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #feffff 0%,#e2feff 35%,#9eede6 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #feffff 0%,#e2feff 35%,#9eede6 100%); /* IE10+ */
background: linear-gradient(to bottom,  #feffff 0%,#e2feff 35%,#9eede6 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffff', endColorstr='#9eede6',GradientType=0 ); /* IE6-8 */
}


.bg-gary-whrite {
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0.06) 98%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(98%,rgba(0,0,0,0.06))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.06) 98%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.06) 98%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.06) 98%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0.06) 98%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#0f000000',GradientType=0 ); /* IE6-9 */
}

.bg-red-orange {
background: rgb(248,80,50); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(248,80,50,1) 0%, rgba(241,111,92,1) 50%, rgba(246,41,12,1) 51%, rgba(240,47,23,1) 71%, rgba(231,56,39,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(248,80,50,1)), color-stop(50%,rgba(241,111,92,1)), color-stop(51%,rgba(246,41,12,1)), color-stop(71%,rgba(240,47,23,1)), color-stop(100%,rgba(231,56,39,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(248,80,50,1) 0%,rgba(241,111,92,1) 50%,rgba(246,41,12,1) 51%,rgba(240,47,23,1) 71%,rgba(231,56,39,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f85032', endColorstr='#e73827',GradientType=0 ); /* IE6-9 */
}
*{
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
 -moz-box-sizing: border-box;    /* Firefox, other Gecko */
 box-sizing: border-box;         /* Opera/IE 8+ */
}

/* 頁次 */	
.page{ font:13px/40px "微軟正黑體"; color:#333; text-align: center; clear:both; margin-top:10px; }
  .page a { background: #333333; color:#fff; padding:5px 15px 7px 15px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
  .page a:hover { background: #e74c57 ; color: #fff;}
.page br { display:none;}


/******  底部資訊  ******/
footer { background:#e7f3ff url(../images/footer-bg.png) ;  }
footer .footer-box{max-width:1140px; margin:0 auto; padding:23px 1%; position:relative; } 
footer .footer-box .infor{ color:#4a4a4a; font-size:14px; line-height:24px; width:60%; float:left;} 

footer .footer-box .infor .logo{ float:left; margin-right:15px;}
footer .footer-box .infor .f-info-content{ display:inline;}
footer .footer-box .infor .f-infor-content span{ display:inline-block; padding:0 10px 0 0; } 
 
 
footer .footer-box .copytight {  color:#4a4a4a; font-size:14px; line-height:24px; text-align:right; position:absolute; right:10px; bottom:23px;}

footer .footer-box .copytight .wd{  padding:0 0 0 20px; font-size:13px;}
footer .footer-box .copytight .wd a{color:#8babc1;}
footer .footer-box .copytight .wd a:hover{color:#2c70a0;}