/* CSS Document */
@import url(font-awesome/css/font-awesome.min.css);

body {	margin:0; text-align:center; font-family:Arial,Helvetica,sans-serif,"微軟正黑體"; font-size:14px; color:#E1E1E1; line-height:24px; background:#171717; }
img {	border:0; }

/* Reset ================================================================================= */

a { text-decoration:none; color:#E1E1E1;
-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:#E1E1E1; 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+ */}

.top-Box, .header-Box, .banner-Box, .content-Box, .footer-Box, .copyright-Box { max-width:1000px; margin:0 auto; text-align:left; position:relative;}

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

.banner { position:absolute; top:55px; right:0px;}
.banner img { max-width:100%;}





.content { clear:both;}

.side_classLink { float:left; width:236px; background:url(../images/left_bg.jpg) no-repeat top center #000; position:relative; padding-bottom:10px; margin-top:35px;}
.side_classLink-bottom { position:absolute; bottom:-22px;}
.side_classLink ul { width:100%; padding-bottom:10px;}
.side_classLink ul li a { color: #A5A5A5; font-size: 14px; display: block; padding: 10px 25px; line-height: 21px; background:url(../images/left_bg_m.png) bottom center no-repeat; background-size:contain; }
.side_classLink ul li a:hover, .side_classLink ul li a.current { color:#0094ff; background:url(../images/left_bg_m-ov.png) no-repeat bottom center; }
.side_classLink ul a.current02{ display:none; }
.m_classLink{ display:none;}
.submenu-title { font-size: 17px; color: #FFF; font-weight: bold; text-align: center; padding: 10px 0px;}

.right-box { float:right; width:72%;}
.path { text-align:right; font-size:13px;color:#9A9A9A;}
.path li { display:inline-block; vertical-align:top;}
.path li:after { content:">"; display:inline-block; vertical-align:top; padding:0 2px;}
.path li:last-child:after { display:none;}
.path li a { color:#9A9A9A;}
.path li a:hover { color:#fff;}

.main-content { padding-right:25px;}
.main-content p { margin:0 0 20px 0;}
h1 { font-family: Tahoma,Geneva,sans-serif; font-size: 20px; font-weight: bold; color: #9DD223; background:url(../images/hr.jpg) no-repeat bottom center; background-size:contain; padding-bottom:25px; margin-bottom:18px; margin-top:10px;}

.product-list:after { content:""; clear:both; display:block; height:30px;}
.product-list li { display:inline-block; width:32%; margin-right:6px; margin-bottom:15px;}
.product-list li a { display:block; padding-bottom:30px; position:relative; color:#A5A5A5;  }
.product-list li a:hover { color:#fff;}
.product-list li a img { width:100%; border: 2px solid #000;}
.product-list li a img:hover { min-width:100%; border: 2px solid #005389;}
.product-list li a span { text-align:center; display:block;}
.product-list li a span i { font-size:12px;}


.applications-list:after { content:""; clear:both; display:block; height:30px;}
.applications-list li { display:inline-table; width:24%; padding:0 10px;}
.applications-list li a { display:block; padding-bottom:30px; position:relative; color:#A5A5A5;  }
.applications-list li a img { width:100%;}
.applications-list li a span { text-align:center; display:block; color:#9DD223; line-height:22px; font-size:15px; }

.pro-detail-top { display:flex; flex-direction:row; flex-wrap:wrap; padding-bottom:24px;}
.pro-detail-top > div { width:50%; text-align:center; padding:0 30px;}
.btn-box { display:flex; flex-direction:row; flex-wrap:no-wrap; justify-content:flex-end; padding-bottom:10px; position: absolute; right: 25px;}
.btn-box a { display:inline-block; margin-left:4px; background:#005695; font-family: Tahoma, Geneva, sans-serif; font-size:13px; font-weight:bold; text-align:center; width:130px; color:#fff;}
.btn-box a:hover { background:#0074c9; color:#fff;}
.btn-box a:first-child { background:#0094ff;}
.btn-box a:first-child:hover { background:#005695;}
.pro-detail-tab { border-bottom: 1px solid #000; display:flex; /*flex-direction:row; flex-wrap:no-wrap;*/ flex-wrap: wrap; max-width: 290px;}
.pro-detail-tab > a, .pro-detail-tab > div { background:url(../images/tabs-in.jpg) no-repeat; width:130px; height:24px; text-align:center; font-size:13px; font-weight:bold; color:#fff; margin-right:2px; display:block; margin-bottom: 1px;}
.pro-detail-tab > a, .pro-detail-tab > div:last-child { background: #6a9800; padding: 0 10px; border-radius: 5px 5px 0 0;}
.pro-detail-tab > a:hover { opacity:0.7;}
.pro-detail-tab-content { padding-top:20px;}

.zoom_btn { text-align:right; line-height:0; padding-bottom:3px; padding-right:2px;}
.back-btn { text-align:right; padding-top:20px;}
.back-btn a { display:inline-block; width:110px; background:#676767; color:#fff; font-size:13px; font-weight:bold; padding:3px 0; font-family: Tahoma, Geneva, sans-serif; text-align:center;}
.back-btn a:hover { background:#363636;}

@media only screen and (max-width: 980px) {

.index-right { float:left; padding-top:50px; padding-right:20px;}
.banner { display:none;}	
	


.side_classLink { display:none;}
.m_classLink{ display:block; position:relative;}
.m_classLink a.main{ display:block; font-size:15px; font-family:"微軟正黑體", "LiHei Pro", "新細明體", sans-serif; border:0px solid #CCC; position:relative; padding:10px; border-radius:0 0 5px 5px; color:#fff; text-align:left; background: #000; border:1px solid rgba(255,255,255,.18);}
.m_classLink a.main i{ display:block; font-size:15px; position:absolute; right:10px; top:50%; margin-top:-8px; color:#fff; font-style:normal; font-family:FontAwesome;}
.m_classLink ul{ display:none; width:100%; background:#000; border-radius:5px; border:0px solid #d1d1d1; position:absolute; z-index:999; padding-bottom:10px; margin-top:2px; padding-top:10px; }
.m_classLink ul li a { color: #A5A5A5; font-size: 14px; display: block; padding: 10px 25px; line-height: 21px; background:url(../images/left_bg_m.png) bottom center no-repeat; background-size:cover; }
.m_classLink ul li a:hover,.m_classLink ul li a.current { color:#0094ff; background:url(../images/left_bg_m-ov.png) bottom center no-repeat; background-size:cover;}
.m_classLink ul a.current02{ display:none; }

.side_classLink-top, .side_classLink-bottom { display:none;}

.right-box { float:none; width:100%; padding:0 10px;}
.main-content { padding-right: 0px;}
.path { padding-top:10px; text-align:left;}
.btn-box {right: 10px;}
}

@media only screen and (max-width: 768px) {
.btn-box { position: inherit;}
.product-list li { width:48%;}
.pro-detail-tab > a, .pro-detail-tab > div { }
}
@media only screen and (max-width: 570px) {

.applications-list li { width:45%;}
.btn-box { position: inherit;}
}
@media only screen and (max-width: 414px) {
.product-list li { width:100%;}

}

/* NEWS */
.news_list{
    float: left;
    width:100%;
    margin-top:20px;
    padding-bottom:10px;
    border-bottom:1px dashed #CCC;
}
.news_list_pic{
    float:left;
    margin-right:10px;
}
.news_list_pic img{
    border:1px solid #CCC;
}
.news_list_right{
    float:left;
}
.news_list_date{
    float: left;
    margin-right: 5px;
}
.news_list_date a{
    color:#0157d9;
    font-weight:bold;
}
.news_list_subject{
    float: left;
}
.news_list_text{
    clear: both;
    float: left;
    margin-top:5px;
    line-height: 22px;
}
.news_title{
    color: #069;
    font-weight: bold;
}

.news_back {
    cursor: pointer;
    padding: 5px 20px;
    margin:5px 0;
    border: 1px solid #018dc4;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: rgba(255,255,255,0.9);
    background: -webkit-linear-gradient(#0199d9 , #0157d9);
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ;
}


/* DOWNLOAD */
.download_table{
    width:100%;
    color: #000;
}
.download_table a{
    color:#FFFFFF;
}
.download_table a:hover{
    color: #069;
}
.download_table th{
    color: #2b82b5;
    font-weight: normal;
    border-top: 1px dotted #2b82b5;
    border-bottom: 2px solid #2b82b5;
    text-align: center;
}
.download_table td{
    border-bottom:1px dotted #CCC;
    text-align:center;
    padding: 5px 0px;
    color:#FFFFFF;
}



/* 聯絡我們-單欄  */
.contact_table {
    width:100%;
}
.contact_table th {
    padding:5px 0;
}
.contact_table td {
    padding:5px 0 5px 10px;
}
.contact_table  tr.altrow {
}
.contact_table input{
    width: 50%;
}
.contact_table textarea{
    width: 50%;
}

.contact_btn {
    display: inline-block;
    cursor: pointer;
    padding: 5px 20px;
    margin:5px 0;
    border: 1px solid #018dc4;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    color: rgba(255,255,255,0.9);
    background: rgba(1,145,217,1);
    background: -moz-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(1,145,217,1)), color-stop(47%, rgba(1,113,217,1)), color-stop(71%, rgba(1,98,217,1)), color-stop(100%, rgba(1,91,217,1)));
    background: -webkit-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -o-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -ms-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: linear-gradient(to bottom, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0191d9', endColorstr='#015bd9', GradientType=0 );
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    box-shadow: 2px 2px 2px 0 rgba(0,0,0,0.2) ;
    text-shadow: -1px -1px 0 rgba(15,73,168,0.66) ;
}
.contact_map tr td iframe{
    width: 100%;
}

@media screen and (max-width: 470px) {
    .contact_table th {width:30%}
    .contact_table td {width:70%}
    .contact_table td select{width:calc(100% - 10px);overflow: hidden}
}

/*SITEMAP*/
#sitemap { }
#sitemap a { text-decoration: none;}
#sitemap li {list-style: none;margin-left: 10px;color: #4d4c4c;line-height: 22px;font-size: 13px;}
#sitemap > ul > li > a{
    display:block;
    margin:15px 0;
    padding: 5px 0;
    max-width:100px;
    -webkit-border-radius: 3px;
    border-radius: 15px;
    text-align:center;
    color: rgba(255, 255, 255, 0.9);
    background: rgba(1,145,217,1);
    background: -moz-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(1,145,217,1)), color-stop(47%, rgba(1,113,217,1)), color-stop(71%, rgba(1,98,217,1)), color-stop(100%, rgba(1,91,217,1)));
    background: -webkit-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -o-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: -ms-linear-gradient(top, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    background: linear-gradient(to bottom, rgba(1,145,217,1) 0%, rgba(1,113,217,1) 47%, rgba(1,98,217,1) 71%, rgba(1,91,217,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0191d9', endColorstr='#015bd9', GradientType=0 );
    -webkit-box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 2px 2px 2px 0 rgba(0, 0, 0, 0.2);
    text-shadow: -1px -1px 0 rgba(15, 73, 168, 0.66);
}
#sitemap #product{ }
#sitemap #product ul { list-style: none; margin: 0; }
#sitemap #product ul li { list-style:none; margin-left:0px; padding: 10px 0 0 20px;clear:both; }
#sitemap #product ul li a{ color: #db422c; margin: 0; }
#sitemap #product .layer0 > li > a:before { content:' '; display: inline-block; width: 18px; height:10px;}
#sitemap #product .layer0 > .sitemap-products > a:before { background-image:none;}
#sitemap #product .layer1 > li > a:before { content:' '; display: inline-block; width: 14px; height:10px;}
#sitemap #product .layer1 > .sitemap-products > a:before { background-image:none;}
#sitemap #product .layer2 > li > a:before { content:' '; display: inline-block; width: 10px; height:10px;}
#sitemap #product .layer2 > .sitemap-products > a:before { background-image:none;}
#sitemap #product .layer3{}
#sitemap #product .sitemap-products{ }
#sitemap #product .sitemap-products a{ border-right: 1px solid #999999; color: #000; display: inline-block; margin: 0 5px 0 0; padding: 0 10px 0 0;  }

/* 詢價車 */
.shop_btn{
    width: 80px;
    height: 30px;
    color: #0f1214;
    margin:10px 5px 0 0;
    border:none;
    border-radius:5px;
    border:1px solid #ccc;
    background: -webkit-linear-gradient(top,#fff,#dadada);
    background: -moz-linear-gradient(top,#fff,#dadada);
    background: -ms-linear-gradient(top,#fff,#dadada);
    background: linear-gradient(top,#fff,#dadada);
}
.shop_btn:hover{
    cursor:pointer;
    background: -webkit-linear-gradient(top,#fff,#c9c9c9);
    background: -moz-linear-gradient(top,#fff,#c9c9c9);
    background: -ms-linear-gradient(top,#fff,#c9c9c9);
    background: linear-gradient(top,#fff,#c9c9c9);
}

.cart_table {
    border: 1px solid #B6B6B6;
    border-collapse: collapse;
    background-color: #FFFFFF;
}
.cart_table tr.stocks_short{
    background:#f00;
    color:grey;
}
.cart_table tr.stocks_short a{color:grey}
.cart_table tr.cart_line{

}
.cart_table tr.stocks_short{
    background:#f00;
    color:grey;
}
.cart_table tr.stocks_short a{color:grey}
.cart_table th {
    color: #333333;
    background-color: #cccccc;
    padding:4px 0px;
    text-align: center;
}
.cart_table td {
    padding: 4px 0px;
    text-align: center;
    color: #000;
}
.cart_table td a{
    color: #000;
}
.cart_table .col_name{ display: none;}
.cart_line td{
    border-bottom: 1px dashed #ccc;
}
.cart_title a {
    color: #000;
}
.cart_title a:hover {
    color: #FF0000;
    text-decoration: none;
}

@media screen and (max-width: 480px) {
    .cart_table th, .cart_table td{
        display: list-item;
        border-bottom: 1px solid #ccc;
    }
    .cart_table thead{display: none;}
    .cart_table tbody, .cart_table tbody tr{display: block;}
    .cart_table tbody td.number{display: none;}
    .cart_table tbody td:nth-of-type(8){border-bottom:2px solid #999;}
    .cart_table .col_name{ display:inline;}
}

/* member form */
.member_table {
    font-size: 14px;
    font-weight: normal;
    text-align: left;
    border-top: 1px solid #B6B6B6;
    border-left: 1px solid #B6B6B6;
    background-color: #FFFFFF;
}
.member_table th {
    color: #333333;
    background-color: #cccccc;
    font-size: 14px;
    line-height: 1.2;
    height: 24px;
    top: 5px;
    font-weight: bold;
    text-align: left;
    padding: 4px 8px;
    border-bottom: 1px solid #B6B6B6;
    border-right: 1px solid #B6B6B6;
}
.member_table td {
    border-bottom: 1px solid #B6B6B6;
    border-right: 1px solid #B6B6B6;
    color: #000000;
}

.member_table td input, .member_table td textarea {
    border: 1px solid #B6B6B6;
    margin: 1%;
}

@media only screen and (max-width: 999px) {
    /* member start */
    .member_table {
        padding: 0; display: block;height: auto; margin: 0 auto;
    }
    .member_table tbody, .member_table td, .member_table tr, .member_table th {
        display: block; width: 100%;
        height: auto;
        padding: 0;
        min-height: 2em;
        line-height: 2em;
    }
    .member_table th {
        font-size: 16px; border-bottom: 0; padding-bottom: 0px; padding-left: 5px;
    }
    .member_table td {padding-left: 5px;}
    .member_table tr:last-child th{
        display: none;
    }
    .member_table input, .member_table textarea{
        max-width: 96%; min-height: 2em; padding: 0 5px; vertical-align: middle;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    .member_table textarea {margin: 2px 0;}
    .member_table input[type="submit"] {height: 40px; width: 60%; max-width: 120px;}
    /* member end */


}