@charset "utf-8";
@import url(../css/font-awesome.min.css);

body { background:#fff url(../images/bg.png) no-repeat center bottom;background-size:100%;   width:100%; height:100%; margin:0; padding:0; font-family:"微軟正黑體";  font-size: 14px; line-height:1.8em;}
html { width:100%; height:auto;}

.warpper { max-width:1200px; margin:0 auto;  padding-bottom:30px; min-height:380px;}
.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;transition: all 0.5s ease 0s;}
img { border:0; vertical-align:middle; width:100%;}
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; 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:#836363; }
::-moz-placeholder { color:#836363; } /* firefox 19+ */
:-ms-input-placeholder { color:#836363; } /* ie */
input:-moz-placeholder { color:#836363; }

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

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




/*** 手機選單、選單 色塊-變色  ***/
.b-color, .slicknav_menu {  } /** 選單顏色 ***/
.slicknav_icon-bar { background-color:#fff;} /** 手機選單ICON按鈕色 ***/
.slicknav_btn { } /** 手機選單ICON按鈕底色 ***/

.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover {  background: #00afff; } /** 選單滑入顏色 ***/
.slicknav_nav>li {} 
.border-color { border-left:7px #A0A0A0 solid;} /** 標題顏色 ***/


header { background:rgba(255,255,255,.95);  border-top:3px #00a0e9 solid; position:fixed; width:100%; box-shadow:0 1px 3px 0 #ccc; z-index:99;}
.head-main { max-width:1200px; margin:0 auto; height:100px;padding:0; position:relative;z-index:99; }
.head-tool {min-width:280px; position: absolute; top:0px; right:0px; text-align:center; overflow:hidden ; display:block;  }
.head-tool li { list-style:none; padding:0; margin:0 10px; float:left; text-align:center;}
.head-tool li a {margin:0; padding:20px 0 0 0; display:block; color:#333; font-size:20px;}
.head-tool li a:hover { background:url(../images/icon_bg.png) no-repeat center -12px;  color:#00a0e9; padding:23px 0 0 0; }
.head-tool li:last-of-type {padding:18px 0 0 0; margin:0 10px;  }
.fa-home{ font-size:22px; padding:1px 0 0 0;}

.head-main .logo {  position:absolute; left:0px; top:10px; width:340px; height:auto;}
.head-main .logo a { color:#a30000;display: block;}
.head-main .logo img { width:100%; height:auto;}
.home { display: block; position:absolute; top:-35px; right:0px; width:25px; height:auto;}
.home_w { display:none;}

.head-main .search{margin:0; padding:0; width:179px; height:28px; border:1px solid #c6c6c6; clear:both; background:none; border-radius:3px;}
.head-main .search input{display:inline-block; margin:0; padding:0 6px; float:left; width:143px; height:26px; line-height:22px; background:#f5f5f5; border-radius:3px 0 0 3px; color:#333;}
.head-main .search button{display:inline-block; margin:0; padding:0; float:right; width:34px; height:26px; border:0; background:#333; color:#fff; font-size:18px; border-radius:0 3px 3px 0;}


.banner { background: #ffffff;  position: relative; }
.banner img { vertical-align:middle; width:100%; height:auto; position:absolute;}
.banner-bg{ background:url(../images/edm_bg.png) no-repeat center top; min-height:20px; background-size:100%;}

h3.login-title { margin:0 0 10px 0; font-family:"Times New Roman"; font-size:24px; line-height:30px; color:#9B9B9B;}
.login-tool { }
.icon-tool { width:40px; height:auto; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px;}

/***  選單與下拉  ***/
nav { position:absolute; bottom:10px; right:0;  }
 .menu { padding:0; list-style:none; position:relative;  margin: 0 auto;display: flex;}
 .menu>li { color:#333; width: 114px; font-size:16px; text-align:center; position:relative;  line-height:1.8em;  cursor:pointer; margin:0;}
 .menu>li:nth-child(7n){  border-right:0px;}
 .menu>li>a { font-size:16px;  color:#333; display:block; padding:0 6px; }  
 .menu>li>a:hover { font-size:18px; color:#446300;position: relative;}
 .menu>li>a:hover:before { content:"";position: absolute;top: calc(50% - 1px);left: 5px;background:#446300;width: 8px; height: 2px;}
 .menu>li>a:hover:after { content:"";position: absolute;top: calc(50% - 1px);right: 5px;background:#446300;width: 8px; height: 2px;}
 .menu>li.sub>ul.sub-menu {display: none; position:static; z-index:999; margin:0; padding:0;  overflow:hidden;}
 .menu>li.sub>ul.sub-menu:before { content:""; display:block;width: 0;height: 0;border-style: solid;border-width: 0 7.5px 8px 7.5px;border-color: transparent transparent rgba(0,153,68,.8) transparent; margin:0 auto;}
 .menu>li.sub:hover ul.sub-menu { position:absolute; display: block; width:100%; left:0; top:28px;}
 .menu>li.sub>ul.sub-menu>li { display:block; border-bottom:1px #81e1ac solid; line-height:1.8em; background:rgba(0,153,68,0.8); }
 .menu>li.sub>ul.sub-menu>li:last-child{border-bottom:0;}
 .menu>li.sub>ul.sub-menu:hover li { display:block;}
 .menu>li.sub>ul.sub-menu>li>a { display:block; color:#fff; padding:5px ;}
 .menu>li.sub>ul.sub-menu>li>a:hover { background:rgba(1,94,23,.9);transform:translateY(0.2em);}
 @media screen and (max-width:970px) {
    .menu>li { width:88px;}
    .menu>li>a:hover:before { display: none;}
    .menu>li>a:hover:after {display: none;}
    .menu>li>a:hover { font-size:16px; color:#446300;}
} 

 /* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:0.3s;
  -moz-animation-duration:0.3s;
  animation-duration:0.3s;
}

/** 首頁區塊 **/
.i-main{ background:url(../images/i-block_bg.png) repeat-x top center;position:relative; z-index:9; margin:-45px 0 0 0; padding:30px 20px 10px 20px;}
.i-block{ }
.i-block .i-block-left{ float:left; width:53%; margin:0 30px 0 0;}
.i-block .i-block-left .i-news{ }
.i-block .i-block-left .i-news-main-title{ font-size:40px; color:#313131; background:url(../images/news-title_bg.png) no-repeat 215px center ; border-bottom:1px #cecece solid; padding:20px 10px 8px 15px; position:relative;font-family: 'Lato', sans-serif;}
.i-block .i-block-left .i-news-main-title-ch{ font-size:18px; color:#313131; padding:0 15px; font-family: "微軟正黑體"; }
.i-block .i-block-left .i-news-main-title .more{ position:absolute; bottom:10px; right:5px;}
.i-block .i-block-left .i-news-main-title .more a{padding:6px 0px 6px 7px; font-size:13px; line-height:1.6em; background:#222222; color:#fff; border-radius:25px; text-align:center; }
.i-block .i-block-left .i-news-main-title .more a:hover{padding:6px 8.5px;}
.i-block .i-block-left .i-news-main-title .more a span{display:none;}
.i-block .i-block-left .i-news-main-title .more a:hover span{display:inline-block; font-size:15px;}
.fa-plus{ font-size:14px; padding:0 10px 0 0 ;}

.i-block .i-block-left .i-news ul{ list-style: none; padding:0; margin:20px 0;}
.i-block .i-block-left .i-news ul li{  padding:0; margin:10px 0; clear:both;}

.i-block .i-block-left .i-news .i-news-date{font-size:13px; color:#fff; line-height:1.8em; background:#00a0e9; padding:4px 15px; float:left; width:120px; margin:0 ; text-align:center;}
.i-block .i-block-left .i-news .i-news-date .day{ font-size:20px;}
.i-block .i-block-left .i-news .i-news-title{ font-size:15px; color:#313131; line-height:1.6em; float:right; width: calc(100% - 120px); }
.i-block .i-block-left .i-news .i-news-title a{ font-size:15px; color:#313131; display:block;padding:5px 15px;overflow : hidden;text-overflow : ellipsis;white-space : nowrap;}
.i-block .i-block-left .i-news .i-news-title a:hover{ font-size:15px; color:#313131; background:#d8eff9; display:block; padding:5px 15px 5px 30px;}

.i-block .i-block-right{ float:right;width: calc(47% - 30px); margin:5px 0;}
.i-block .i-block-right .i-material{ float:left; width:50%; }
.i-block .i-block-right .i-material .material-contect{ margin:0;background:#f5fbe8; padding:10px;}
.i-block .i-block-right .i-material .material-contect ul{ list-style: square; padding:0 ; margin:10px 0 10px 30px; color:#009944;}
.i-block .i-block-right .i-material .material-contect ul li{ float: left; width:50%;  padding:0; margin:0;}
.i-block .i-block-right .i-material .material-contect ul li a{   font-size:15px; color:#313131;padding:5px 0; line-height:1.8em;}
.i-block .i-block-right .i-material .material-contect ul li a:hover{  color:#009944;}
.i-block .i-block-right .i-material .material-contect:before{ display:block; content:"";width: 0;
height: 0;
border-style: solid;
border-width: 0 17px 18px 17px;
border-color: transparent transparent #f5fbe8 transparent; margin:-28px auto 10px auto; position:relative; z-index:9;}


.i-block .i-block-right .i-product{ float:right; width:50%;}

.i-block .i-block-right .i-product .product-contect{ margin:0 ;background:#f5fbe8;padding:10px; }
.i-block .i-block-right .i-product .product-contect ul{ list-style: square;margin:10px 0 10px 30px;color:#009944; padding: 0 0 10px 0;}
.i-block .i-block-right .i-product .product-contect ul li{  padding:0; margin:0; }
.i-block .i-block-right .i-product .product-contect ul li a{   font-size:15px; color:#313131; padding:5px 0; line-height:1.8em;}
.i-block .i-block-right .i-product .product-contect ul li a:hover{  color:#009944;}
.i-block .i-block-right .i-product .product-contect:after{ display:block; content:"";
width: 0;
height: 0;
border-style: solid;
border-width: 18px 17px 0 17px;
border-color: #f5fbe8 transparent transparent transparent;
 margin:10px auto -28px auto; position:relative; z-index:9;}

.block-img{ }
.block-img img{width:100%;}
.block-title{ background:url(../images/title_bg.png) repeat-y; font-size:18px; color:#fff; line-height:1.8em; padding:2px 10px; margin:0px; }
.block-bg{ min-height:23px; background-size:cover; background:url(../images/block_bg.png) no-repeat top center ; background-size:100%;}

@media screen and (max-width:1100px) {
.i-block .i-block-right .i-material .material-contect ul li{width:100%;}
.i-block .i-block-right .i-product .product-contect ul{ min-height:91px;}

}
/*****  首頁產品  *****/
.i-pro { margin:0 auto; padding:30px 0 0 0;}
.i-pro .i-pro-main-title{ font-size:40px; color:#194500; background:url(../images/pro-title_bg.png) no-repeat 365px center ; border-bottom:1px #c3d0bc solid; padding:20px 10px 8px 15px; position:relative;font-family: 'Lato', sans-serif;}
.i-pro .i-pro-main-title-ch{ font-size:18px; color:#4f6941; padding:0 15px; font-family: "微軟正黑體"; }
.i-pro .i-pro-main-title .more{ position:absolute; bottom:10px; right:5px;}
.i-pro .i-pro-main-title .more a{padding:6px 0px 6px 7px; font-size:13px; line-height:1.6em; background:#153a01; color:#fff; border-radius:25px; text-align:center; }
.i-pro .i-pro-main-title .more a:hover{padding:6px 8.5px;}
.i-pro .i-pro-main-title .more a span{display:none;}
.i-pro .i-pro-main-title .more a:hover span{display:inline-block; font-size:15px;}
.fa-plus{ font-size:14px; padding:0 10px 0 0 ;}

.i-pro ul {  margin:0 auto; padding:20px 0; list-style:none;}
.i-pro ul li {width: calc(20% - 11.2px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff;}
.i-pro ul li:nth-child(5n){ margin:7px 0px 7px 0px; }

.i-pro ul li:hover { background:#f8f6f6;}
.i-pro ul li h4 { background:rgba(231,241,224,.9); font-size:15px; color:#303030; line-height:1.6em; font-weight:normal; padding:7px 5px; margin:0; border-top:3px rgba(57,141,1,.9) solid; position:relative; z-index:2; height:39px; overflow:hidden;}
.i-pro ul li .contect { position:absolute; bottom:0; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: hidden;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; width:100%; }
.i-pro ul li:hover .contect { position:absolute; bottom:39px; left:0;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; height:44px; }

.i-pro-photo { background:#fff; width:100%; position: relative; display:table; }
.i-pro-photo a { display: table-cell; height:168px; vertical-align: middle; text-align:center;}
.i-pro-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}


/** 研發中心 **/
.research{ display:block; padding: 0 0 20px 0;}
.research_block{float: left;position: relative;width:25%;}
.research_block .research_menu{position:absolute;color:#fff;text-align:center;-webkit-perspective:500px;-moz-perspective:500px;-ms-perspective:500px;-o-perspective:500px;perspective:500px}

.research_block .cube-container,.research_block .face-normal,.research_block .face-hover{position:absolute;left:0;top:0;width:100%;height:100%;
		-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;-o-transform-style:preserve-3d;transform-style:preserve-3d}
.research_block .face-normal,.research_block .face-hover{overflow:hidden}
.research_block .cube-container{-webkit-transition:all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition:all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
	-o-transition:all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);transition:all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1)}
	.research_block .research_menu-1{width:100%;position: relative;float: left; height: 285px;		}
	.research_block .research_menu-1 .cube-container{-webkit-transform:translateZ(-141.2px);-moz-transform:translateZ(-141.2px);-ms-transform:translateZ(-141.2px);-o-transform:translateZ(-141.2px);transform:translateZ(-141.2px)}
	.research_block .research_menu-1 .face-normal{background-color:#c6b277;-webkit-transform:translateZ(141.2px);-moz-transform:translateZ(141.2px);-ms-transform:translateZ(141.2px);
		-o-transform:translateZ(141.2px);transform:translateZ(141.2px);border-radius:0 50px 0 0;}
		.research_block .research_menu-1 .face-hover{background-color:#c6b277;-webkit-transform:rotateX(-90deg) translateZ(141.2px);-moz-transform:rotateX(-90deg) translateZ(141.2px);-ms-transform:rotateX(-90deg) translateZ(141.2px);-o-transform:rotateX(-90deg) translateZ(141.2px);transform:rotateX(-90deg) translateZ(141.2px)}
		.research_block .research_menu-1 .face-hover .research_menu-title .l1{top:-50px}.research_block .research_menu-1 .face-hover .research_menu-title .r-title{top:50px;}
.r-title{ text-align:center; padding:130px 15px;}
.research_block .research_menu-title{display:inline-block;
	vertical-align:middle;
	font-size:24px;
	line-height:26px;
	float: left;
	width: 100%;
	height: 100%;
	background: url(../images/r_bg.png) no-repeat left bottom;
	text-shadow:1px 1px 4px #777; background-size:cover;}

@media screen and (min-width:400px){
	.research_block .research_menu:hover .research_menu-title,.research_block .research_menu:hover .research_menu-title .r-title{left:0 !important;top:0 !important}
	.research_block .research_menu-1:hover .cube-container{
		-webkit-transform:translateZ(-141.2px) rotateX(90deg);
		-moz-transform:translateZ(-141.2px) rotateX(90deg);
		-ms-transform:translateZ(-141.2px) rotateX(90deg);
		-o-transform:translateZ(-141.2px) rotateX(90deg);
		transform:translateZ(-141.2px) rotateX(90deg)
	}

}

/** 研發中心列表 **/
.research-list{}
.research-list ul{ list-style:none; padding:0; margin:0; display:flex;flex-wrap:wrap;justify-content:center;}
.research-list ul li{flex-basis:24%; margin: .5%;}
.research-list ul li .research-list-title{ font-size:16px; color:#fff; text-align:center; background:url(../images/arrow.png) no-repeat center center; background-size:100%; width:100%; display:block; padding:5px 10px;}
.research-list ul li .research-list-contect{ font-size:15px; color:#333;  width:100%; display:block; padding:10px; line-height:1.4em; }


.r-pro-photo { background:#fff; width:100%; position: relative; display:table; padding:10px;}
.r-pro-photo a { display: table-cell; height:220px; vertical-align: middle; text-align:center;}
.r-pro-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}

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

.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; font-size:15px; color:#900; padding-bottom:10px;}
.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: #b33939; color: #fff; padding:3px 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; padding:20px; }


/*****  購物車  *****/
.cart-body { margin:0 auto;}
.shopping-car { padding:0 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; margin: 0 auto;}
.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; margin-bottom:20px;}
              .count-price { font-size:24px; font-family:Verdana; color: #900; font-weight:bold;}
.shopping-car .portal { display:block; font-size:15px; color:#900; float:right; text-align:right;}
.shopping-car .freight { display:block; font-size:15px; color:#900; padding-bottom:10px;}



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: #A70002; color: #fff;  min-height:0px; padding:5px 0; border: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; margin:5%; text-align:center;}
.shop-car-name { display:table-cell; padding-top:30PX;  font-size:15px; vertical-align:middle; text-align:center;} 
.shop-car-price {  display:table-cell; padding-top:30PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-quantity { display:table-cell; padding-top:30PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-subtotal{  display:table-cell; padding-top:30PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-del {  display:table-cell; padding-top:30PX;  font-size:15px; vertical-align:middle; text-align:center;}
.shop-car-del a { background: #A70002; color:#fff; padding:3px 10px; line-height:1.5em; }
.shop-car-del a:hover { background: rgb(255,48,25); /* Old browsers */}

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


.checkout-box { padding:10px; margin-left:10px; border-bottom:2px #FFF dotted;}
.checkout-box h3 { background: #cca932; border-left:5px #7e6c2d solid; font-size:15px; color:#fff; line-height:40px; margin: 0 0 5px 0; 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;}



/*****  產品搜尋  *****/
.s-pro-list {}
.s-pro-list ul { margin:0 ; padding:20px 10px; list-style:none;}
.s-pro-list ul li {width: calc(25% - 10.5px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff;}
.s-pro-list ul li:nth-child(4n){ margin:7px 0px 7px 0px; }

.s-pro-list ul li:hover { background:#f8f6f6;}
.s-pro-list ul li h4 { background:rgba(231,241,224,.9); font-size:15px; color:#303030; line-height:1.6em; font-weight:normal; padding:7px 5px; margin:0; border-top:3px rgba(57,141,1,.9) solid; position:relative; z-index:2; height:39px; overflow:hidden;}
.s-pro-list ul li .contect { position:absolute; bottom:0; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: hidden;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; width:100%; }
.s-pro-list ul li:hover .contect { position:absolute; bottom:39px; left:0;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; height:44px; }
.s-pro-photo { background:#f7f7f7; width:100%; position: relative; display:table;}
.s-pro-photo a { display: table-cell; height:210px; vertical-align: middle; text-align:center;}
.s-pro-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}
@media screen and (max-width:900px) {
.s-pro-list ul li {width: calc(33.33% - 9.5px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff;}
.s-pro-list ul li:nth-child(4n){ margin:7px 14px 7px 0px; }
.s-pro-list ul li:nth-child(3n){ margin:7px 0px 7px 0px; }
.s-pro-photo a { display: table-cell; height:202px; vertical-align: middle; text-align:center;}

}

/** 專業服務 **/
.service-list {}
.service-list ul { margin:0 ; padding:20px 10px; list-style:none;}
.service-list ul li {padding:0; text-align:center; border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff; display:flex;border-radius:0 20px 0 0; overflow:hidden;}
.service-information{flex:1;box-shadow:2px 0 10px 0 #ddd inset;}
.service-list ul li:nth-child(3n+1){ border:0; border-bottom:3px #009944 solid; }
.service-list ul li:nth-child(3n-1){ border:0; border-bottom:3px #00a0e9 solid; }
.service-list ul li:nth-child(3n){ border:0; border-bottom:3px #ff7e00 solid;  }
.service-list ul li:nth-child(3n+1) h4 { background:#009944; font-size:16px; color:#fff; font-weight:bold; line-height:1.6em;padding:7px 10px 7px 20px;  margin:0; text-align:left;}
.service-list ul li:nth-child(3n+1) .contect {padding:5px 10px 5px 20px; font-size:15px; color:#009944; line-height:1.6em;width:100%; text-align:left; }


.service-list ul li:nth-child(3n-1) h4 { background:#00a0e9; font-size:16px; color:#fff; font-weight:bold; line-height:1.6em;padding:7px 10px 7px 20px;  margin:0; text-align:left;}
.service-list ul li:nth-child(3n-1) .contect {padding:5px 10px 5px 20px; font-size:15px; color:#00a0e9; line-height:1.6em;width:100%; text-align:left; }


.service-list ul li:nth-child(3n) h4 { background:#ff7e00; font-size:16px; color:#fff; font-weight:bold; line-height:1.6em;padding:7px 10px 7px 20px;  margin:0; text-align:left;}
.service-list ul li:nth-child(3n) .contect {padding:5px 10px 5px 20px; font-size:15px; color:#ff7e00; line-height:1.6em;width:100%; text-align:left; }


.service-photo { background:#fff; width:100%; position: relative; display:table; width:250px;}
.service-photo a { display: table-cell; height:250px; vertical-align: middle; text-align:center;}
.service-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}


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

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

.pro-list {}
.pro-list ul { margin:0 ; padding:20px 10px; list-style:none;}
.pro-list ul li {width: calc(25% - 10.5px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff;}
.pro-list  ul li:nth-child(4n){ margin:7px 0px 7px 0px; }

.pro-list ul li:hover { background:#f8f6f6;}
.pro-list ul li h4 { background:rgba(231,241,224,.9); font-size:15px; color:#303030; line-height:1.6em; font-weight:normal; padding:7px 5px; margin:0; border-top:3px rgba(57,141,1,.9) solid; position:relative; z-index:2; height:39px; overflow:hidden;}
.pro-list ul li .contect { position:absolute; bottom:0; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: hidden;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; width:100%; }
.pro-list ul li:hover .contect { position:absolute; bottom:39px; left:0;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; height:44px; }


.pro-photo { background:#f7f7f7; width:100%; position: relative; display:table;}
.pro-photo a { display: table-cell; height:165px; vertical-align: middle; text-align:center;}
.pro-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}

.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; }

@media screen and (max-width:1000px) {
	.pro-list ul li {width: calc(33.33% - 9.4px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 14px 7px 0px; position:relative; background:#fff;}
.pro-list  ul li:nth-child(4n){ margin:7px 14px 7px 0px; }
.pro-list  ul li:nth-child(3n){ margin:7px 0px 7px 0px; }
.pro-photo a { display: table-cell; height:180px; vertical-align: middle; text-align:center;}

}

.pro-detaile { padding:20px 10px; }
h3.pro-detaile-title { font-size: 18px; color:#184701; line-height:1.8em; padding:30px 0 4px 60px; margin: 0 0 10px 0; font-weight: normal; border-bottom:1px #ccc solid; background:  url(../images/title-icon03.png) no-repeat 10px 5px; background-size:35px;}
.pro-detaile .pro-photo {background:#fff; width:100%; margin:0 0 10px 0; padding:0 20px 0 0;}
.pro-detaile .pro-photo img { width:100%; height:auto;}
.pro-specification {  font-size:15px; line-height:1.6em; color:#333; position:relative; margin-bottom:10px;}
.pro-specification p { }
.pro-content { padding:0px 0; font-size:15px; line-height:1.6em; color:#333; clear:both;} 
.pro-content p.spec { margin:0; padding:0; font-size:12px; line-height:1.5em; color:#333;}

.pro-list-date { background: url(../images/time.png) left center no-repeat; font-size:12px; color: #968c69; padding-left: 20px;}

h3.pro-introduce {font-weight:normal; background:#f1f6ee;  padding:10px 20px; font-size:20px; color:#1a4f00; position:relative; border-top:1px #587b46 solid;  border-bottom:1px #587b46 solid;}
h3.pro-introduce:before { content:"◤"; display:block; position:absolute; top:-9px; left:-2px; color:#587b46;}
h3.pro-introduce:after { content:"◢"; display:block;position:absolute; bottom:-7px; right:-1px; color:#587b46;}

.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; text-align:right; margin:20px 0; color: #F00;  vertical-align:middle; display:block;}
.cart-info .quantity { font-size:16px; color: #333;  vertical-align:middle; display:block; 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 { background: #eee; padding:10px 0; text-align:center; margin-top:20px; }

.size { margin:5px 0; padding:7px 0; border-bottom:1px #DFDFDF solid;  border-top:1px #DFDFDF solid; }
.size ul { list-style:none; margin:0 auto; padding:0;}
.size ul li { background:#AAAAAA; font-size:12px; color:#ffffff;  margin:0 2px; float:left; cursor:pointer; width:25px; line-height:25px; text-align:center;}
.size ul li:hover { background:#5E9BC7;}
.size ul li.active { background:#5E9BC7; }
.size ul li.none { background:#E7E7E7; }
.size ul li.title { background: none; font-size:15px; color:#575757; width:auto; }

/**** 產明細圖片特效樣式 ****/
.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%; }
.slider-wrap a                              { height:auto;}
.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%;} /**四張圖 乘 四分之一 **/

/**相關連結**/
.link {}
.link ul { margin:0 ; padding:0px 0; list-style:none;}
.link ul li {width: calc(20% - 10px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 5px; position:relative; background:#fff;}
.link ul li:hover { background:#f8f6f6;}
.link ul li h4 { background:rgba(231,241,224,.9); font-size:15px; color:#303030; line-height:1.6em; font-weight:normal; padding:7px 5px; margin:0; border-top:3px rgba(57,141,1,.9) solid; position:relative; z-index:2; height:39px; overflow:hidden;}


.link-photo { background:#fff; width:100%; position: relative; display:table;}
.link-photo a { display: table-cell; height:105px; vertical-align: middle; text-align:center;}
.link-photo img.index-pro-img { width: auto; height: auto; max-width:100%; max-height:100%;}



/*****  聯絡我們  *****/
.contact-body { padding:0; margin:0 0 15px 0; }
.contact-body-contect{ padding:0; background:#ebf4f7;box-shadow: 0 0 0 3px #f1f7ed; padding:10px 15px; margin:0 0 0 0; position:relative; color:#333; font-size:15px; line-height:1.8em;}
.contact-body-contect:before{ content:"╔"; display:block; position:absolute; top:-12px; left:-5px; color:#97bcc8; font-size:20px;}
.contact-body-contect:after{ content:"╝"; display:block; position:absolute; bottom:-10px; right:-5px; color:#97bcc8; font-size:20px;}

.contact-note { padding:5px 15px; font-size:14px; color:#fff; clear:both; background:#f65f70; line-height:1.8em; margin:0 0 10px 0;  width:14%;background:  linear-gradient(-135deg, transparent 15px, #f65f70 0) top right, linear-gradient(-45deg, transparent 15px, #f65f70 0) bottom right;background-size: 100% 52%; background-repeat: no-repeat;border-radius: 3px 0 0 3px;}
@media screen and (max-width: 970px) {
.contact-note { width:20%;}
} 
@media screen and (max-width:690px) {
.contact-note { width:30%;}
} 
@media screen and (max-width:460px) {
.contact-note { width:50%;}
} 

.contact-left { }
.contact-left img { width:100%; height:auto; margin-top:0px; }
.btn-send { font-size:13px;} 
a.btn-send { background:#7dac96;  padding: 5px  20px; text-align:center; font-size:14px; color:#fff; width:100px; margin:2px; background:linear-gradient(135deg, transparent 6px, #7dac96 0);}
a.btn-send:hover {background:#3fc384; }
a.btn-reset { background: #e62e44; padding: 5px 20px; text-align:center; font-size:14px; color:#fff; width:100px; margin:2px;background:linear-gradient(135deg, transparent 6px, #e62e44 0);}
a.btn-reset:hover {background: #f2475b; }


a.btn-send-over { background: #834c04; padding: 5px  20px; text-align:center; font-size:13px; color:#fff; width:100px; margin:2px; }
a.btn-send-over:hover { background: #673c03;}

img.code { width:100px; height:30px; margin:0 5px 0 0; vertical-align:middle;}

/*****  FAQ  *****/
.faq {}
.faq ul { margin:0; padding:0 5px; list-style:none;}
.faq ul li { border-bottom:1px #fff solid; }
.faq ul li .qa_title { background: #ffffff; font-weight:normal; border-left:8px #ad0a0a solid;}
.faq ul li a { color: #ad0a0a; font-size:15px; display:block; padding:10px 0 10px 10px;}
.faq ul li a:hover { background:#f7eaea;}
.faq ul li .qa_content { border-top:1px #CCC dotted; padding:10px 0 20px 25px; font-size:13px; line-height:1.5em; color:#666;}

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




/*****  最新消息  *****/
.news{ }
.news ul{ list-style: none; padding:0; margin:20px 0;}
.news ul li{ float:left; width:50%;  padding:0; margin:10px 0; }

.news .news-date{font-size:13px; color:#fff; line-height:1.8em; background:#00a0e9; padding:4px 15px; float:left; width:120px; margin:0 ; text-align:center;}
.day{ font-size:20px;}
.news .news-title{ font-size:15px; color:#313131; line-height:1.6em; float:right; width: calc(100% - 120px); }
.news .news-title a{ font-size:15px; color:#313131; display:block;padding:5px 15px;overflow : hidden;text-overflow : ellipsis;white-space : nowrap;}
.news .news-title a:hover{ font-size:15px; color:#313131; background:#d8eff9; display:block; padding:5px 15px 5px 30px;}
.content-body .time {background:#00a0e9; font-size:14px; color:#fff; line-height:1.8em; padding:2px 15px; text-align:right; background: linear-gradient(-45deg, transparent 10px, #00a0e9 0);}



/*****  內頁架構  *****/
.content-body { margin:0 auto; padding:20px 20px 40px 20px; background:rgba(255,255,255,.9);background: linear-gradient(-45deg, transparent 35px, rgba(255,255,255,.9) 0);}
.page-title { background:#f3f7f9 url(../images/title-icon.png) 10px 10px no-repeat ; font-size:24px; color:#05567b; padding:25px 10px 0px 80px; line-height:1.8em; margin:10px 0 10px 0; border-bottom:1px #ccc solid; background-size:60px; }
.page-title:after { content:""; display:block; background:url(../images/title-icon02.png) left 0px no-repeat; margin:0 0 -58px -70px;background-size:60px; height:58px; }

.page-main { padding:20px 10px 10px 10px; font-size: 15px; color:#666666; line-height:1.8em;  }
.page-main img{ width:100%;}

.left-menu-title { background: #a70101; text-align:center; font-size:18px; color: #fff; padding:5px 0 10px 0;  
                   -webkit-border-radius:0 0 5px 0px; -moz-border-radius:0 0 5px 0px; border-radius:0 0 5px 0px;}
				   
				   
.wd_font001{ background:#06833d; color:#fff; font-size:18px;  padding:2px 5px; margin:0 2px;border-radius:4px;}				   
.wd_font002{ background:#e92727; color:#fff; font-size:18px; padding:2px 5px ; margin:0 2px;border-radius:4px;}				   
.wd_font003{  color:#ef7318; font-size:18px;  font-weight:bold;}	
.wd_font004{ float:left; width: calc(100% - 315px);}								   
.wd_font005{ background:#eea915; color:#fff; font-size:18px; padding:2px 5px 2px 15px; margin:10px 2px 0 2px;border-left:5px #cb8e0a solid; width:180px;  background: linear-gradient(-135deg, transparent 15px, #eea915 0) top right, linear-gradient(-45deg, transparent 15px, #eea915 0) bottom right; background-size: 100% 52%; background-repeat: no-repeat;border-radius:5px 0 0px 5px;}	
.wd_font006{ float:left; width:300px; margin:0 0 0 15px;}								
.wd_font007{ text-align:center; }								   
.wd_font008{  color:#e96d09; font-size:20px; text-align:center;  font-weight:bold; padding:15px 0 2px 0;}	
.wd_font009{ background:url(../images/about003.png) no-repeat top right;}	

				   
/*****  上方第一層分類  *****/
.in-left-menu {  }
.in-left-menu>ul { margin:0; padding:10px 0 30px 0; list-style:none; text-align:center; }
.in-left-menu>ul>li  { display:inline-block; margin:0 5px; text-align:center; font-size:15px; color:#666; padding:0; line-height:1.8em;border:1px #00a0e9 solid ;}
.in-left-menu>ul>li>a {color:#333; display:block; padding:6px 15px 4px 15px; line-height:1.5em; border-bottom:2px #00a0e9 solid;}
.in-left-menu>ul>li>a:hover { background: #00a0e9 ; border-bottom:2px #fff solid; color:#fff;}
.in-left-menu>ul>li .current{ background: #00a0e9 ; border-bottom:2px #fff solid; color:#fff;}
.in-left-menu>ul>li .current:after{ content:""; display:block;width: 0;
height: 0;
border-style: solid;
border-width: 8px 10px 0 10px;
border-color: #00a0e9 transparent transparent transparent; margin: 6px auto -14px auto;}

.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;  }

.m_classLink{display:none;}


/*****  左邊第二層分類  *****/
.in-left-menu02 {  }
.in-left-menu02>ul { margin:0; padding:6px 0 30px 0; list-style:none; text-align:center; }
.in-left-menu02>ul>li  { display: block; margin:5px 0; text-align: left; font-size:15px; color:#666; padding:0; line-height:1.8em;border:1px #1781ee solid ;}
.in-left-menu02>ul>li>a {color:#333; display:block; padding:6px 15px 4px 15px; line-height:1.8em; border-left:4px #1781ee solid;}
.in-left-menu02>ul>li>a:hover { background: #1781ee ; border-left:4px #fff solid; color:#fff;}
.in-left-menu02>ul>li .current02{ background: #1781ee ; border-left:4px #fff solid; color:#fff; position:relative;}
.in-left-menu02>ul>li .current02:after{ content:""; display:block;width: 0;
height: 0;
border-style: solid;
border-width: 20.5px 0 20.5px 8px;
border-color: transparent transparent transparent #1781ee;
 margin:-1px 0 0 0; position:absolute; right:-9px; top:0;}

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

.m_classLink02{display:none;}



/*****  內頁BANNER  *****/
.c-banner{position:relative;  padding:0; }
.c-banner img{ width:100%; }

.inside-banner {position:absolute;bottom:20px;left:0; width:100%; }
.inside-banner .banner-title { background:rgba(0,0,0,.6);  max-width:300px; font-size:40px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:46px 15px 25px 15px;border-radius:200px 200px 0 0;}
.inside-banner .banner-title .banner-title-ch { font-size:18px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }
.banner-title-ch:before {  content:"─ "; display:inline-block; padding:0 10px;}
.banner-title-ch:after { content:" ─"; display:inline-block; padding:0 10px;}

.inside-banner02 {position:absolute;bottom:0px;left:0; width:100%; }
.inside-banner02 .banner-title02 { background:rgba(0,0,0,.6);  max-width:300px; font-size:40px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:46px 15px 25px 15px;border-radius:200px 200px 0 0;}
.inside-banner02 .banner-title02 .banner-title-ch02 { font-size:18px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }
.banner-title-ch02:before {  content:"─ "; display:inline-block; padding:0 10px;}
.banner-title-ch02:after { content:" ─"; display:inline-block; padding:0 10px;}

@media screen and (max-width:1100px) {
	.c-banner{position:relative;  padding:103px 0 0 0 ; }
	.banner{position:relative;  padding:103px 0 0 0 ; }

}

a.cart { background:#ffffff; padding:5px 8px; color:#cecece; font-size:15px; display:block; border:1px #f499a4 solid;  width:49%; margin-right:1%; float:left;}
a.cart img { padding-right:0px; vertical-align:middle;}
a.cart:hover { background: #ffffff; color:#620001;}

a.check { background:#ffffff; padding:5px 8px; color:#cecece; font-size:15px; display:block; border:1px #f499a4 solid;  width:49%; margin-left:1%; float:left;}
a.check img { padding-right:0px; vertical-align:middle;}
a.check:hover { background: #ffffff; color:#5C0001;}

.index-more { max-width:1000px;  margin:50px auto 0 auto; position:relative; }
.index-more a { background:url(../images/index-more-pro.png) #cb0000 bottom no-repeat; color:#ffffff; width:132px; padding: 10px 0 20px 0; display:block; margin:0 auto; text-align:center; }


/*****  首頁連結  *****/
.index-link {  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-search-news {  margin:0 auto; padding:0 15px;}
.index-search { }
.index-search h3 { background:#9f0000; font-size:18px; color:#ffffff; font-weight:normal; line-height:40px; margin:10px 0 10px 0; padding:0 10px; }
.index-search span { display:block; float:right; font-size:15px; color:#d1d1d1; font-weight:normal;}
.index-search-input { padding:0px 0 10px 0; position:relative; color:#333;}
.index-search-input img { position:absolute; right:0; top:0px;}
.index-search input { background: #e8d5d5; font-size:15px; color: #333; padding:5px 0 5px 20px; line-height:21px; width:100%; 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;}
.cor-080 { width:80%; float:left;}





/*** 訂位填寫  ***/
.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-family:Impact; font-size:28px; line-height:1.2em; color:#D9D9D9; border-left:1px #a71f21 solid; padding:0px 0; text-align:center;}
.step li:nth-child(1){ border-left:0px;}
.step li.active , .step li.active span { color: #dfb240; }
.step li span { color:#7F7F7F; display:block; font-size:13px; font-family:"微軟正黑體"; line-height:18px; padding: 5px 0 0 0px; border-top:1px #DBD8D8 dotted; margin:10px auto 0 auto; width:80%;}


/***  定位-選項-時段  ***/
.order-opinion { padding: 0 0 10px 0; }

.time { font-size:14px; color:#7E7E7E; line-height:20px;}
.time ul { margin:0; padding:0; list-style:none;}
.time ul li { background:#FF5558; float:left; text-align:center; font-size:14px; color:#fff; line-height:20px; padding:3px 0px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; margin:1% 1% 0 0; width:11.5%;}
.time ul li a { color:#fff;}
.time ul li:hover { background: #D30003; }
.time ul li.finish { background:#D3D2D2;}
.time ul li span { display:block; border-top:1px #FFB6B7 solid; line-height:20px;}

.order-note { color:#DF0205; padding:10px 0;}


/***  歷史訂單  ***/
.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 { min-width: 280px; padding-right: 0px;}
.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 { margin-bottom:10px; }
.opinion-left01 { background: #1996d0; float:left; width:30%; border-bottom:3px #0071a6 solid; padding:5px 15px; font-size:15px; font-family:"微軟正黑體"; color:#ffffff; line-height:1.8em;}
.opinion-left02 { background: #1996d0; float:left; width:30%; border-bottom:3px #0071a6 solid; padding:5px 15px; font-size:15px; font-family:"微軟正黑體"; color:#ffffff; line-height:1.8em; display:none;}
				  
.opinion-right01 { float:left; width:7.5%; padding:0px 2%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px; border-left:0;}
				  
.input-main-style01 { float:left; width:55%; margin:0; padding:5px 3%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px;}
.input-main-style02 { background:#fff; float:left; width:70%; border: 0; margin:0; padding:6px 15px; font-size:15px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:1.8em; border-bottom:1px #0071a6 dashed;}			
.input-main-style03 { background:#f0e7e7; float:left; width:93.3333%; margin:0; border: 0; padding:5px 3%; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:20px; text-align:center; }						 .input-main-style04 { background:#fff; float:left; width:35%; border: 0; margin:0; padding:6px 3%; font-size:15px; font-family:"微軟正黑體"; color:#4E4E4E; line-height:1.8em; border-bottom:1px #0071a6 dashed;}			

					 
.select-style { background: #8a6e0c; font-size:15px; color:#ffffff; line-height:20px; padding:5px 10px; border: 0; }

.order-numb { color:#FF0004;}

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

input { }
.input-style01 { background:#fff; border:1px #0071a6 solid; padding:5px 3%; line-height:20px; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; width:100%; margin-bottom:5px; }

.input-botton01 { padding:5px 3%; 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 3%; 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 */}



/* 頁次 */	
.page{ height:40px; font:13px/40px "微軟正黑體"; color:#333; text-align: center; clear:both; margin-top:10px; }
  .page a { background: #017133; color:#fff; padding:5px 15px; background: linear-gradient(135deg, transparent 6px, #017133 0); }
  .page a:hover { background: #06ac50; color: #fff;}
  .page br { display:none;}

/******  底部資訊  ******/
.footer_bg{ background:url(../images/footer_bg.png) no-repeat bottom center; min-height:131px; background-size:cover; }
footer { background:rgba(0,0,0,.82); }
footer .footer{ max-width:1200px; margin:0 auto;  }

footer .footer .bottom-info { }
footer .footer .bottom-info .bottom-left{ float:left; width:60%; padding:7px 0; }
footer .footer .bottom-info .bottom-left>ul{ list-style:none; padding:0; margin:0; }
footer .footer .bottom-info .bottom-left>ul>li{ float:left;  padding:0 20px 0 0; margin:0 10px 0 0; font-size:18px; color:#fff; }
footer .footer .bottom-info .bottom-left>ul>li>a:after{ content:""; display:block; background:#00a0e9; height:2px; width:35px; margin:3px 0 0 0;}

footer .footer .bottom-info .bottom-left>ul>li a{ font-size:18px; color:#fff; }
footer .footer .bottom-info .bottom-left>ul>li a:hover{font-size:18px; color:#5cccff; }


footer .footer .bottom-info .bottom-left>ul>li>ul{ list-style:none; padding:0; margin:10px 0; min-height:96px; }
footer .footer .bottom-info .bottom-left>ul>li>ul>li{ width:100%; padding:0; margin:0; font-size:15px; color:#bae9ff; line-height:1.6em; }
footer .footer .bottom-info .bottom-left>ul>li>ul>li a{ font-size:15px; color:#bae9ff;}
footer .footer .bottom-info .bottom-left>ul>li>ul>li a:hover{  transform:translateX(50%);font-size:15px; color:#ffe09c;}
.block-width001{ width:17%;}
.block-width002{ width:25%;}

footer .footer .bottom-info .bottom-right{ float:right; width:40%;   }
footer .footer .bottom-info .bottom-right .f-logo{ font-size:18px; color:#fff; line-height:1.8em; }
footer .footer .bottom-info .bottom-right .f-information{ font-size:15px; color:#fff; line-height:1.6em; }
footer .footer .bottom-info .bottom-right .f-information .f-information01{ padding:5px 0 3px 0; }
footer .footer .bottom-info .bottom-right .f-information .f-information02{ padding:3px 0 5px 0; }

footer .footer .f-link{ clear:both; float:right; min-width:310px; padding: 0;}
footer .footer .f-link>ul{ list-style:none; padding:0; margin:0;  }
footer .footer .f-link>ul>li{ float:left; padding:0; margin:0 10px; font-size:15px; color:#bebebe; line-height:1.6em; text-align: center; }
footer .footer .f-link>ul>li a{font-size:15px; color:#bebebe; }
footer .footer .f-link>ul>li a:hover{font-size:15px; color:#fff;}
.fa-link{ font-size:18px; padding:2px 0 20px 0;}
.fa-envelope{ font-size:18px;}
.fa-facebook-square{ font-size:18px;}

footer .footer .copyright{ font-size:12px; color:#aaa; line-height:1.6em; clear:both; text-align:center; padding:10px 0;text-transform:uppercase; }
footer .footer .copyright a{ font-size:12px; color:#aaa; }
footer .footer .copyright a:hover{ font-size:12px; text-decoration:underline;}

.wd{ padding:0 20px; }

@media screen and (max-width:1200px) {
footer .footer{padding:0 5px;  }

footer .footer .bottom-info .bottom-left>ul>li{ text-align:center; }
footer .footer .bottom-info .bottom-left>ul>li>a:after{ margin:3px auto;}

footer .footer .bottom-info .bottom-left{ float: inherit; width:85%; padding:7px 0;margin:0 auto; }
footer .footer .bottom-info .bottom-right{ float: inherit; width:85%; margin:0 auto; }
footer .footer .bottom-info .bottom-right .f-information .f-information01{ padding:5px 0 5px 0; float:left; width:49%; margin:0 1% 0 0; }
footer .footer .bottom-info .bottom-right .f-information .f-information02{ padding:5px 0 5px 0; float:left; width:49%; margin:0 0 0 1%  }
footer .footer .f-link{  padding:10px 0 0 0;}

}
@media screen and (max-width:920px) {
	.footer_bg{ background:url(../images/footer_bg.png) no-repeat bottom center; min-height:90px; background-size:cover; }

footer .footer .bottom-info .bottom-left{ float: inherit; width:98%; padding:7px 0;margin:0 auto; }
footer .footer .bottom-info .bottom-right{ float: inherit; width:98%; margin:0 auto; }
footer .footer .bottom-info .bottom-right{ text-align:center;}

}

a.first-buy  { background: #e75353; padding: 15px; font-size: 18px; color: #ffffff; display:block; text-align: center;}
a.first-buy:hover {  background: #c42d2d; }