@charset "utf-8";
body { 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:640px; margin:0 auto;}
.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;}

@media screen and (max-width:400px) {
.head-tool li { list-style:none; padding:0; margin:0 6px; float:left; text-align:center;}
.head-tool li:last-of-type { margin:0 6px; }
.head-main .search{ width:156px; }
.head-main .search input{width:120px; }

}
.home { display:none; }
a.home_w { display: block; position:absolute; top:5px; left:10px; width:30px; height:auto; padding: 0; }
a.home_w img { width: 100%; height: auto;}

.m-banner { width:100%; overflow:hidden; position: relative; z-index:1000;}
.m-banner img { position:absolute; top:-50%;  }
.banner { }
.banner img { width:100%;}
.oproject { display: inline; color:#900;}
.banner-bg{ background:url(../images/edm_bg.png) no-repeat center top; min-height:20px; background-size:100%; margin:-1px 0 0 0;}


/** 研發中心 **/
@media screen and (max-width:440px) {
.research_block{float: left;position: relative;width:100%;}
	.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:0px 0px 0 0px;}
/** 研發中心列表 **/
.research-list ul li{flex-basis:99%; border-bottom:1px #ccc solid;}
.r-pro-photo a {height:auto;}

}



/** 專業服務 **/
@media screen and (max-width:450px) {
.service-list ul li {display: block;}
.service-photo { background:#fff; width:100%; position: relative; display:table;}
.service-information{flex:1;box-shadow:0 2px 10px 0 #ddd inset;}
}

/**相關連結**/
@media screen and (max-width:640px) {
.link ul li {width: calc(50% - 10px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 5px; position:relative; background:#fff;}
}
@media screen and (max-width:450px) {
.link ul li {width: calc(100% - 10px); padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 5px; position:relative; background:#fff;}
}

/***** 訂單列表  *****/
.order-search { padding-left:0px;}
ul.order-list li.th { display:none;}
.order-list { padding-left:0px;} 
.order-list-img, .order-list-img02 { float:left; width:100%; font-size:15px; text-align:center;}
   .order-list-img { height:auto;}
  .order-list-img img.pro-photo { width:86%; max-width:180px; height:auto; padding:2%; border:1px #CCC solid; margin:5%; text-align:center;}
  .order-list .order-list-td { font-size:15px; color: #333; text-align: left;}
  
  
.order-list-name { width:100%;  padding-top:0PX;  font-size:15px; text-align:center;} 
.order-list-price { float:left; width:100%;  padding-top:0PX;  font-size:15px; text-align:center;}
.order-list-quantity, .order-list-quantity02 { float:left; width:100%; padding-top:0PX;  font-size:15px; text-align:center;}
.order-list-subtotal, .order-list-subtotal02 { float:left; width:100%;  padding-top:0PX;  font-size:15px; text-align:center;}
.order-list-del { float:left; width:100%;  padding:20PX 0;  font-size:15px; text-align:center;}
.order-list-del a { padding: 5px 10%;}

.order-list .portal { width:100%; text-align: center;}
.order-list .freight { width:100%;  text-align: center;}
.order-list .oproject { font-size:15px; color:#000; display: inline; }

.order-ditaile-info { padding:0 0 0 0px; }

/*****  購物車  *****/
ul.shopping-car-list li.th { display:none;}
.shopping-car { padding:0px;} 
.shop-car-img { width:100%; height:auto; text-align:center; border-bottom:1px #D3D3D3 dotted; margin-bottom:10px; display:block;}
  .shop-car-img img.pro-photo { width:86%; max-width:180px; height:auto; padding:10px; border:1px #CCC solid; margin:10px auto; text-align:center; display:block;}
  
.shop-car-name { float:none; display:block;  width:100%;  padding-top:0PX;  font-size:15px; text-align:center;} 
.shop-car-price {  width:100%;  padding-top:0PX;  font-size:15px; text-align:center;}
.shop-car-quantity {  width:100%; padding-top:0PX;  font-size:15px; text-align:center;}
.shop-car-subtotal{ width:100%;  padding-top:0PX;  font-size:15px; text-align:center;}
.shop-car-del {  width:100%;  padding:20PX 0;  font-size:15px; text-align:center;}
.shop-car-del a { padding: 5px 10%;}

.shopping-car .portal { width:100%; text-align: center;}
.shopping-car .freight { width:100%;  text-align: center;}
.shopping-car .oproject { font-size:15px; color:#000; display: inline; }

.checkout-box { background:#F4F3F0; padding: 10px; margin-left:0px; border-bottom:2px #FFF dotted; }


/*****  產品專區  *****/
.pro-photo a { display: table-cell; height:225px; vertical-align: middle; text-align:center;}
.pro-list ul li .contect { position:absolute; bottom:39px; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; }

@media screen and (max-width:450px) {
.pro-list ul li {width:98%; padding:0; text-align:center; float:left;border:1px #cecece solid; margin:7px 1%; position:relative; background:#fff;}
.pro-list  ul li:nth-child(4n){ margin:7px 1%; }
.pro-list  ul li:nth-child(3n){ margin:7px 1%;}
.pro-list  ul li:nth-child(2n){margin:7px 1%; }

.pro-photo a { display: table-cell; height: auto; vertical-align: middle; text-align:center;}

}
.pro-store-info {  padding:10px 0 10px 0px; }
.pro-detaile { padding-left:0px; padding-right:0px; }
.pro-detaile .pro-photo {background:#fff; width:100%; margin:0 0 10px 0; padding:0 0px 0 0;}

.pro-qr-code { text-align:center; padding-bottom:20px;}
.pro-qr-code img { width:200px; height:auto;}
.cart-info .price { font-size:28px; text-align:center; display:block; padding:10px 0 20px 0;}
.cart-info .quantity {text-align: center;}
.cart-info .check-out { text-align:center; clear:both; display:block;}
.cart-info .check-out a { font-size:15px; width:100%; padding:10px 0px; margin-left:0px; display:block;}

/** 產品搜尋 **/
.s-pro-list ul li .contect { position:absolute; bottom:39px; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; }

@media screen and (max-width:580px) {
.s-pro-list ul li {width: calc(50% - 7px); 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 14px 7px 0px; }
.s-pro-list ul li:nth-child(2n){ margin:7px 0px 7px 0px; }

.s-pro-photo a { display: table-cell; height:195px; vertical-align: middle; text-align:center;}

}
@media screen and (max-width:450px) {
.s-pro-list ul li {width:98%; padding:0; text-align:center; float:left;border:1px #cecece solid;margin:7px 1%; position:relative; background:#fff;}
.s-pro-list ul li:nth-child(4n){margin:7px 1%; }
.s-pro-list ul li:nth-child(3n){margin:7px 1%; }
.s-pro-list ul li:nth-child(2n){margin:7px 1%;  }

.s-pro-photo a { display: table-cell; height: auto; vertical-align: middle; text-align:center;}

}


/*****  聯絡我們  *****/
.contact-body { padding:0 0 0 0px;}
.contact-left { max-height:200px; overflow:hidden; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.contact-left img { width:100%; height:auto; margin-top:10px;}

a.btn-send {padding: 5px 0;  width:46%; margin:0 2%; display:block; float:left;}
a.btn-reset { padding: 5px 0; width:46%; margin:0 2%; display:block; float:left;}
a.btn-send-over { padding: 3px  0px; color:#fff; width:100%; display:block; float:left; margin-top:5px;}

/*****  內頁架構  *****/
.page-main { padding: 0 0 0 0px; }
.left-menu-title { font-size:15px; border-top:1px #999 dotted;}
.page-title { background:#f3f7f9 ; font-size:24px; color:#05567b; padding:10px; line-height:1.8em; margin:10px 0 10px 0; border-bottom:1px #ccc solid; background-size:60px; }
.page-title:after { content:""; display: none; background:url(../images/title-icon02.png) left 0px no-repeat; margin:0 0 -58px -70px;background-size:60px; height:58px; }

/*****  上方第一層分類  *****/
.classBox{padding:0 0 20px 0;}
ul.classLink{display:none;}
.m_classLink{display:block; position:relative; background-color:#fff; border:1px solid #00a0e9;}
.m_classLink a.main{display:block; background:none; font-size:15px; font-family:"微軟正黑體", "新細明體", sans-serif; color:#333; position:relative; padding:10px;}
.m_classLink a.main i{display:block; font-size:15px; background:#00a0e9; width:45px; height:100%; text-align:center; color:#FFF; line-height:40px; position:absolute; right:0; top:0;}
.m_classLink ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#eaf3f7; border:1px solid #00a0e9; position:absolute; left:0; top:100%; z-index:999; box-sizing:border-box;}
.m_classLink ul li{margin:0; padding:0;}
.m_classLink ul li a{display:block; padding:12px 10px; border-top:1px solid #00a0e9; font-family:"微軟正黑體", "新細明體", sans-serif; font-size:15px; color:#222;}
.m_classLink ul li:first-child a{border:none;}
.m_classLink ul li a:hover{background:#2baeea; color:#fff;}

/*****  左邊第二層分類  *****/
.classBox02{padding:0 0 20px 0;}
ul.classLink02{display:none;}
.m_classLink02{display:block; position:relative; background-color:#fff; border:1px solid #1781ee;}
.m_classLink02 a.main02{display:block; background:none; font-size:15px; font-family:"微軟正黑體", "新細明體", sans-serif; color:#333; position:relative; padding:10px;}
.m_classLink02 a.main02 i{display:block; font-size:15px; background:#1781ee; width:45px; height:100%; text-align:center; color:#FFF; line-height:40px; position:absolute; right:0; top:0;}
.m_classLink02 ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#e8f2fd; border:1px solid #1781ee; position:absolute; left:0; top:100%; z-index:999; box-sizing:border-box;}
.m_classLink02 ul li{margin:0; padding:0;}
.m_classLink02 ul li a{display:block; padding:12px 10px; border-top:1px solid #1781ee; font-family:"微軟正黑體", "新細明體", sans-serif; font-size:15px; color:#222;}
.m_classLink02 ul li:first-child a{border:none;}
.m_classLink02 ul li a:hover{background:#2baeea; color:#fff;}

/*****  首頁產品  *****/
.i-pro { padding:10px 0 0 0;}
.i-pro ul { height:595px; overflow:hidden; margin: 0 0 20px 0; padding:20px 0 0 0;}
.i-pro ul li {width: calc(50% - 7px); }
.i-pro ul li:nth-child(2n){ margin:7px 0px 7px 0px; }
.i-pro ul li:nth-child(3n){ margin:7px 14px 7px 0;}
.i-pro-photo a { display: table-cell; height:233px; vertical-align: middle; text-align:center;}
.i-pro ul li .contect { position:absolute; bottom:39px; left:0; background:rgba(57,141,1,.9); padding:5px 10px; font-size:13px; color:#fff; line-height:1.4em;visibility: visible;transition: all 0.3s ease 0s; overflow:hidden; z-index:1;height:44px; }

@media screen and (max-width:540px) {
.i-pro .i-pro-main-title{ font-size:34px; background:none; padding:20px 10px 8px 0px; }
.i-block .i-block-left .i-news-main-title{ font-size:34px; background:none; padding:20px 10px 8px 0px;}
.i-block .i-block-left .i-news .i-news-date{padding:4px 6px; width:100%; }
.i-block .i-block-left .i-news .i-news-date .day{ font-size:18px;}
.i-block .i-block-left .i-news .i-news-title{ width:100%; }
.i-block .i-block-left .i-news .i-news-title a{ padding:5px 10px;overflow: inherit;text-overflow:inherit;white-space :inherit;}
.i-block .i-block-left .i-news .i-news-title a:hover{  padding:5px 10px;}
.news .news-date{padding:4px 6px;  width:100%; }
.day{ font-size:18px;}
.news .news-title{ width:100%;}
.news .news-title a{ padding:5px 10px;overflow: inherit;text-overflow:inherit;white-space :inherit;}
.news .news-title a:hover{ padding:5px 10px;}

}

@media screen and (max-width:450px) {
.i-block .i-block-right .i-material{ float:left; width:100%; margin:0 0 10px 0; }
.i-block .i-block-right .i-product{ float:right; width:100%;}
.i-block .i-block-right .i-material .material-contect:before{  margin:-26px auto 10px auto;}
.i-pro ul { height: auto; overflow: inheritrgin: 0 0 20px 0; padding:20px 0 0 0;}
.i-pro-photo a { display: table-cell; height: auto; vertical-align: middle; text-align:center;}

.i-pro ul li {width:100%;margin:7px 0px 7px 0px;  }
.i-pro ul li:nth-child(2n){ margin:7px 0px 7px 0px; }
.i-pro ul li:nth-child(3n){ margin:7px 0px 7px 0px;}
.i-pro ul li:nth-child(5n){ margin:7px 0px 7px 0px;}
.i-pro .i-pro-main-title{ font-size:28px; }
.i-block .i-block-left .i-news-main-title{ font-size:28px; }
.i-block .i-block-left .i-news-main-title-ch{ font-size:16px; padding:0 5px; }
.i-pro .i-pro-main-title-ch{ font-size:16px; padding:0 5px;}
.fa-plus{ font-size:12px; padding:0 10px 0 0 ;}
.i-block .i-block-left .i-news-main-title .more a{padding:5px 0px 5px 6px; font-size:12px; }
.i-block .i-block-left .i-news-main-title .more a:hover{padding:5px 8.5px;}
.i-pro .i-pro-main-title .more a{padding:5px 0px 5px 6px; font-size:12px;}
.i-pro .i-pro-main-title .more a:hover{padding:5px 8.5px;}

}
/*****  內頁BANNER  *****/
.inside-banner .banner-title { background:rgba(0,0,0,.3);  max-width:220px; font-size:32px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:35px 10px 15px 10px;border-radius: 200px 200px 0 0;}
.inside-banner .banner-title .banner-title-ch { font-size:16px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }

@media screen and (max-width:500px) {
	.inside-banner .banner-title { background:rgba(0,0,0,.3);  max-width:180px; font-size:26px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:10px;border-radius:5px 5px 0 0;}
.inside-banner .banner-title .banner-title-ch { font-size:14px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }
}

.inside-banner02 .banner-title02 { background:rgba(0,0,0,.3);  max-width:220px; font-size:32px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:35px 10px 15px 10px;border-radius: 200px 200px 0 0;}
.inside-banner02 .banner-title02 .banner-title-ch02 { font-size:16px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }

@media screen and (max-width:500px) {
	.inside-banner02 .banner-title02 { background:rgba(0,0,0,.3);  max-width:180px; font-size:26px; color:#fff; margin:0 auto; text-align:center;line-height:1.4em; text-transform:uppercase; font-family:'Lato', sans-serif; padding:10px;border-radius:5px 5px 0 0;}
.inside-banner02 .banner-title02 .banner-title-ch02 { font-size:14px; color:#cadfc6; font-family:微軟正黑體;line-height:1em;  }

}


/*****  首頁連結  *****/
.index-link ul li { float:left; width:50%; margin:0; padding:0; border:0;}

/*****  首頁 搜尋 最新消息模組  *****/
.i-news { padding-left:0px;}
.i-news h3 { border-bottom:1px #CCC solid;}

/*****  內頁架構  *****/
.content-body { margin:0 auto; padding:10px 0px; background:rgba(255,255,255,.9);background: linear-gradient(-45deg, transparent 35px, rgba(255,255,255,.9) 0);}


/***  會員登入  ***/
h3.login-title { margin:10px 0 10px 0; font-family:"Times New Roman"; font-size:30px; line-height:30px; color:#9B9B9B; text-align:center;}
.login-tool {text-align:center; }
.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;}


/***  版面欄位  ***/
.main { padding: 0px 10px;}
.col-m  { width:100%; margin-right:0%; float:none;}
.col-100 {}
.col-015, 
.col-020, 
.col-025, 
.col-030, 
.col-035, 
.col-040, 
.col-045, 
.col-050, 
.col-055, 
.col-060, 
.col-065, 
.col-070, 
.col-075, 
.col-080,
.col-085 { width:100%; margin-right:0%;}


.cor-015, 
.cor-020, 
.cor-025, 
.cor-030, 
.cor-035, 
.cor-040, 
.cor-045, 
.cor-050, 
.cor-055, 
.cor-060, 
.cor-065, 
.cor-070, 
.cor-075, 
.cor-080,
.cor-085 { width:100%;}

.wd_font007{ text-align: left; }								   

 
/*** 訂位區塊  ***/
.info-box { font-size:14px; color:#7E7E7E; line-height:20px;}

/***  定位-選項-時段  ***/
.order-opinion { width:100%; margin-right:0; float: none;}
.time { width:100%; float: none;}

.time ul li {margin:1% 1% 0 0; width:24%;}


/***  step  ***/
.step li { font-size: 18px; }
.step li span { height: 38px; padding: 5px 10px; }


/***  表單欄位  ***/
.form-box {min-width: auto; padding-right: 0px;}
.form-style01 { font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; padding:5px 3%; line-height:20px; width:93%;}
.input-main-style02 {  padding:5px 3%; width:93.3333%; }

.opinion { margin-bottom:15px; }
.opinion-left01 { float:left; width:100%;padding:5px 3%;}

.opinion-left02 { display:block; float:left; width:100%;padding:5px 3%;}
.opinion-right01 { float:left; width:7.5%; padding:0px 2%;}
.input-main-style01 { float:left; width:81%; margin:0; padding:5px 3%; -webkit-border-radius:5px 0px 0px 5px; -moz-border-radius:5px 0px 0px 5px; border-radius:5px 0px 0px 5px;}

.select-style { font-size:15px; width:96%; line-height:20px; padding:5px 2%;  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
.input-style01, .input-main-style02, .input-main-style03 { float:none; width:100%;}
.checkout-box h3 { margin-right:0;}
.input-style01 { background:#fff; border:0; border-bottom:1px #0071a6 dashed; padding:5px 3%; line-height:20px; font-size:14px; font-family:"微軟正黑體"; color:#4E4E4E; width:100%; margin-bottom:0px; }

.cart-btn { height: auto; overflow: auto;}
a.btn-send-over { margin-left:0px;}

/* 頁次 */	
.page{ height:100px;}
.page br { display: block;}

/******  底部資訊  ******/
footer .footer .f-link{ clear:both; float: inherit;width:292px; margin:0 auto; min-width:inherit; }

footer .footer .f-link>ul>li{ float:left; padding:0; margin:0 6px; font-size:15px; color:#bebebe; line-height:1.6em; text-align: center; }

.wd{ padding:0 20px; clear:both; display:block; }

