/* CSS Document */
@import url(font-awesome/css/font-awesome.min.css);

body {	-webkit-text-size-adjust:100%; margin:0; text-align:center; font-family:Tahoma,"微軟正黑體"; font-size:14px; color:#484848; line-height:20px; background:url(../images/bg.jpg) top center;}
img {	border:0; }
.left { float:left;}
.right { float:right;}
 /* Reset ================================================================================= */

a { text-decoration:none; color:#484848;
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s; }
a:hover {	color:#484848; text-decoration:none; }

* { margin:0; padding:0; list-style:none;
-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */}

.main-Box,   .menu-Box, .banner-Box, .content-Box, .content2-Box, .footer-Box, .copyright-Box { max-width:1002px; margin:0 auto; text-align:left; position:relative; clear:both;}

.after-0:after { clear:both; display:block; content:""; height:0; text-indent:-99999px;}
.after-5:after { clear:both; display:block; content:""; height:5px; text-indent:-99999px;}
.after-10:after { clear:both; display:block; content:""; height:10px; text-indent:-99999px;}
.after-15:after { clear:both; display:block; content:""; height:15px; text-indent:-99999px;}
.after-20:after { clear:both; display:block; content:""; height:20px; text-indent:-99999px;}

#gotop { display: none; position: fixed; right:20px; bottom:20px; cursor: pointer; }
#gotop a { display:inline-block; width:30px; height:30px; border-radius:100%; padding-top:6px; color:#000; opacity:0.5;  filter: alpha(opacity=50); background:#fff;}
#gotop a:hover { color:#000; opacity:1;  filter: alpha(opacity=80);}


#master{ position:relative; top:-45px; background:url(../images/idx-master-bg.png) no-repeat center top; padding:25px 0 0 0;}
.left-box { float:left; width:163px;}
.pro-search { padding:10px 10px 0 0px;}
.pro-search div { float:left; width:calc(100% - 28px); padding-right:5px;}
.search-txt { height:28px; background:#fff; line-height:28px; padding:0 3px 0 3px; width:100%; border:1px solid rgba(0,0,0,.2); font-size:13px;}
.pro-search a { color:#975978; line-height:28px; width:28px; text-align:center; display:block; float:right; font-size:20px;}
.side_classLink { }
.side_classLink-title { background:url(../images/submenu-title-bg.png) no-repeat top center; height:86px; letter-spacing:-0.5px; padding-top:24px; font-size:12px; color:#644520; font-family: Tahoma,"微軟正黑體"; text-align:center;}
.side_classLink-title span { font-size:19px; font-weight:bold; display:block;}
.side_classLink ul { padding-top:10px;}
.side_classLink ul li { padding:20px 0 8px 10px; font-weight:bold; text-align:left; position:relative;}
.side_classLink ul li a > div { position:absolute; right:0; padding-right:20px; top:20px;}
.side_classLink ul li a > div img { width:43px;}
.side_classLink ul li a{ display:inline-block; color:#484848; font-size:16px;}
.side_classLink ul li a:hover, .side_classLink ul li a.current { color:#643c0b; }
.side_classLink ul li span { display:block; text-align:center; border-width:1px 0; border-style:solid; border-color:#8E775C; padding:15px 0; margin:5px 20px 0 0px; font-size:14px; font-weight:bold; font-family: Tahoma,"微軟正黑體";}
.side_classLink ul li span a { color:#644520; padding:5px 0; display:block; font-size:14px;}
.side_classLink ul li span a:hover, .side_classLink ul li span a.current { color:#FC5028;}
.side_classLink ul li.current02{ display:none; }
.m_classLink{ display:none;}

.right-box { float:left; width:calc(100% - 163px); padding:20px 10px 40px 20px; color:#484848;}
.right-box p { line-height:22px; }
h1 { color:#651146; letter-spacing:-0.5px; font-size:19px; text-align:center;}
h1 span { font-size:12px; color:#432538; display:none; font-weight:normal;}
.path { padding:10px 0 10px 0; background:url(../images/h1-bg.png) no-repeat center bottom; text-align:center; color:#484848; font-size:13px; font-weight:bold; margin-bottom:26px;}
.path a, .path a:hover { color:#484848; }

h2{ font-size: 15px;font-weight: 500;}


.pro-list01 { text-align:left;}
.pro-list01 li { width:196px; height:294px; display:inline-block; padding:0px 3px 0 3px;    vertical-align: top; }
.pto { height:189px; overflow:hidden; position:relative; display:block;}
.pto-more { position:absolute; background:url(../images/more-bg.png) no-repeat top center; width:100%; height:39px; bottom:-39px; text-align:center;font-size:16px; font-weight:bold; padding:10px 0;
-webkit-transition: all 0.2s ease-out 0s;
-moz-transition: all 0.2s ease-out 0s;
transition: all 0.2s ease-out 0s;}
.pto-more a, .pto-more a:hover { color:#644520; }
.pro-list01 li:hover .pto-more { bottom:0;}
.pro-list01 li span { display:block; padding:10px 0; font-size:16px; font-weight:bold; color:#A45686; text-align:left;}
.pro-list01 li span a { color:#A45686;}
.pro-list01 li span a:hover { color:#FC5028;}

.fix{ text-align: center;}
.fix:before{ display: inline-block; width: 0px; height: 100%; vertical-align: middle; content: ' ';}
.fix img,.fix p{ display: inline-block; max-width: 100%; max-height: 100%; vertical-align: middle; box-sizing: border-box;}

.pro-box { }
.pro-b { float:left; width:50%; }
.pro-b img { width:100%;}
.pro-b-img { }
.pro-b-img img { }
.rslides_tabs { padding-top:10px;}
.rslides_tabs li { display:block; float:left; width:25%; padding:0 3px; opacity:0.5;  filter: alpha(opacity=50);}
.rslides_here { opacity:1 !important;  filter: alpha(opacity=100) !important;}
.rslides_tabs li a img { border:1px solid #e8e8e8; width:100%;}

.pro-content { float:left; width:50%; padding-left:44px; line-height: 36px; font-weight: bold; }
.pro-content strong { font-size:18px;}
.product_show_title {  font-family: Tahoma,"微軟正黑體";  font-size: 16px;  font-weight: bold;  color: #FC5028; line-height:22px; padding-bottom:10px;}
.pro-content p { color:#383838; letter-spacing:0.5px;}
.cart_btn { background: #e56243; color: #fff; padding: 3px 5px; border-radius: 2px; font-size: 17px;}
.cart_btn:hover { color:#fff;}

.btn-box { padding:20px 0 10px 0; text-align:center;}
.btn-box a { display:inline-block; padding:0 30px 10px 30px; color:#9E9D99; font-family: Verdana,"微軟正黑體";}
.btn-box a:hover { color:#9E9D99;}

.tab_box { padding-top:30px;}

 .about_title {
    font-family: Tahoma, "微軟正黑體";
    font-size: 16px;
    font-weight: bold;
    color: #a45686;
    padding: 0 0 15px 0;
    letter-spacing: -0.5px;
 }

#about_block01, #about_block02,  #about_block03 { margin-bottom:3%;}
#about_block01 {
    background: url(../images/about-pic01.jpg) no-repeat right bottom;
		min-height:260px;
}
#about_block03 { width:48%; }
.about_text ul li {
    list-style-type: none;
    padding-bottom: 1em;}
.about_text ul li h3 {
    font-size: 16px;
    color: #a45686;}
	.about_text ul li ul li {
    padding-bottom: 0.1em;
    padding-left: 0.5em;}
.about_text ul li h3:before {
    content: "• ";
    color: #ebaf13;
}
.about_text ul li ul li:before {
    content: "。 ";
    color: #ebaf13;
}
.about_text ul li p {
    padding-bottom: 0.1em;
    padding-left: 1em;
}

/*得獎記錄*/
.icon-box {
    display: inline-block;
    text-align: center;}
.fix {
    text-align: center;
    font-size: 0;
}
.fix img, .fix p {
    display: inline-block;
    max-width: 100%;
    max-height: 100%;
    vertical-align: middle;
    box-sizing: border-box;
    font-size: 14px;
}
.fix a{color:#FFF;	}
.icon-list {
    width: 180px;
    height: 180px;
    border-radius: 100px;
    color: #FFF;
    display: inherit;
    margin: 25px;
    line-height: 26px;
}
/*得獎記錄end*/


/*歷史沿革*/

.about-list { width: 100%;    padding: 3%;}
.about-list th {
    padding: 10px 10px 10px 0;
    width: 13%;
}
.about-list td span {
    font-size: 18px;
    font-weight: bold;
    color: #a45686;
    display: block;
    padding: 5px 0;
}
.about-list td ul li:before {
    content: "• ";
    color: rgb(235, 175, 19);
}
.about-list td ul { padding-bottom:15px;}








/*歷史沿革end*/

/*影片RWD*/
.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}/*影片RWD end**/

/*特色*/

#info { text-align: center;}
#info .right { float:right;}
.info_img {  width:40%}
.info_text{
	width: 50%;
    font-family: 微軟正黑體;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    padding: 2%;
	  }
.info_title {
	color: #8A1E24;
    font-weight: bold;
    font-size: 21px;
    font-family: 微軟正黑體;
    letter-spacing: 6px;
    margin-bottom: 20px;
    padding: 15px;
    background: url(../images/info_line.png) no-repeat bottom center;

}
.info_text p {color: #a4854f;
    font-size: 16px;
    line-height: 30px;
	font-weight:bold;}
.pro-choice-color span.select,.pro-choice-size span.select{border:1px solid red}
.buy{     margin-top: 40px;}
.buy a {    color: white;
    background: #8c5e2c;
    text-decoration: none;
    padding: 5px 10px;
    border-radius: 18px;}
 .buy a:hover {  background:#EABE8D;;}

/*特色END*/
@media only screen and (max-width: 960px) {
.left { float:none;}
.right { float:none;}
 #about_block03 { width:100%; }
}

@media only screen and (max-width: 768px) {
.left-box { width:100%; float:none;}
.side_classLink-title { display:none;}
.pro-search { position:relative; background:#fff; padding:10px; top:-10px;}

.side_classLink { display:none;}
.m_classLink{ display:block; position:relative; border-bottom:1px solid #D6D6D6; top:-18px;}
.m_classLink a.main{ display:block; font-size:18px; font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter", Monaco, "Courier New", monospace; position:relative; padding: 14px 10px 12px 10px; color:#333; text-align:left; cursor:pointer; background:#fff; }
.m_classLink a.main i{ display:block; font-size:20px; position:absolute; right:20px; top:52%; margin-top:-11px; color:#333; font-style:normal; font-family:FontAwesome;}
.m_classLink ul{ display:none; width:100%;  position:absolute; z-index:999; margin-top:0px; background:#fff; border: 1px solid #CCC; padding-bottom:20px;}
.m_classLink ul li { padding:20px 0 0px 10px; font-weight:bold; text-align:left; position:relative;}
.m_classLink ul li a > div { display:none;}
.m_classLink ul li a > div img { width:43px;}
.m_classLink ul li a{ display:inline-block; color:#484848; font-size:16px;}
.m_classLink ul li a:hover, .m_classLink ul li a.current { color:#643c0b; }
.m_classLink ul li span { display:block; text-align:left; border-width:1px 0; border-style:solid; border-color:#8E775C; padding:15px 0; margin:5px 20px 0 0px; font-size:14px; font-weight:bold; font-family: Tahoma,"微軟正黑體";}
.m_classLink ul li span a { color:#644520; padding:5px 0; display:block; font-size:14px;}
.m_classLink ul li span a:hover, .m_classLink ul li span a.current { color:#FC5028;}
.m_classLink ul li.current02{ display:none; }

.right-box { float:none; width:100%; padding-bottom:0px; padding-left:10px; padding-top:5px;}
.pro-list01 { text-align:center;}
}

@media only screen and (max-width: 570px) {
.pro-b { width:100%; text-align:center;}
.pro-content { width:100%; padding:10px 0;}
.about-list th {
    display: block;
    width: 35%;
    margin: 0 auto;
}
.about-list td {
    display: block;
}
.info_img, .info_text{ width:70%; display: block; margin: 0 auto; }
 #about_block01 {  min-height:280px;}

}

@media only screen and (max-width: 414px) {
 #about_block01 {  min-height:auto; background: none;}
#info .right{ float:none;}
}

@media only screen and (max-width: 320px) {
.info_img, .info_text {
    width: 90%;
}
}
