@charset "utf-8";

*{padding:0;margin:0;box-sizing: border-box}
body{font-family:Arial,微軟正黑體;background:#fff;color:#000;font-size:15px;

    /*防iphone文字大小跑掉*/
    -webkit-text-size-adjust: 100%;
}

.CLEAR{
    clear:both !important;
    float:none !important;
    width:0 !important;
    height:0 !important;
    padding:0 !important;
    margin:0 !important
}

a{color:inherit;text-decoration:none;}
img{max-width: 100%;}
.HTML img{height:auto !important;}
.HTML ul, .HTML ol{padding-left:20px;}
.HTML{line-height: 28px;}
.HOME_CONTAINER li, .HEADER li, form li{list-style: none;}
li>a{display: block}

.CONTAINER{width:80%; max-width: 100%; margin:0 auto;}
.HEADER_BG{
    border-bottom:3px solid #e70012;

    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fcfcfc+0,efefef+100 */
    background: #fcfcfc; /* Old browsers */
    background: -moz-linear-gradient(top, #fcfcfc 0%, #efefef 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #fcfcfc 0%,#efefef 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #fcfcfc 0%,#efefef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfcfc', endColorstr='#efefef',GradientType=0 ); /* IE6-9 */
    display: block !important;
}

.LOGO{
    float:left;background: url(../images/logo_bg.png) right top no-repeat;width:25%;height:90px;padding-left:5%;
    /*
    position: relative;
    -ms-transform: skew(10deg,0deg);
    -webkit-transform: skew(10deg,0deg);
    transform: skew(10deg,0deg);
    overflow: hidden;*/
}

/*.LOGO:after {
content: " ";
position: absolute;
display: block;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: -1;
transform-origin: bottom left;
-ms-transform: skew(-30deg, 0deg);
-webkit-transform: skew(-30deg, 0deg);
transform: skew(-30deg, 0deg);
}

.LOGO img{
-ms-transform: skew(-10deg,0deg);
-webkit-transform: skew(-10deg,0deg);
transform: skew(-10deg,0deg);
}

*/



.NAV {float:right}
.NAV li{float:left;list-style:none;}
.NAV li>a{text-decoration:none;font-size:16px;font-weight:bold;padding:15px 20px;display:block;border-radius:15px;}
.NAV li>a:hover{color:#e70012;}
.NAV li:nth-of-type(1) a{padding-left:25px;background: url(../images/icon-pro.png) left center no-repeat;}
.NAV li:nth-of-type(2) a{padding-left:30px;background: url(../images/icon-dis.png) left center no-repeat;}
.NAV li:nth-of-type(3) a{padding-left:25px;background: url(../images/icon-addr.png) left center no-repeat;}

.MENU2 {display: none}

.HEADER>.RIGHT{margin-right:3%;}
.HEADER_TOP {width:550px;float:right;}
.NAV{float:right;}
.TOP_LINKS>a:nth-of-type(1), .TOP_LINKS>a:nth-of-type(2), .TOP_LINKS>a:nth-of-type(3){float:left;padding-top:5px;margin-left:10px;}
.TOP_LINKS>a:nth-of-type(1){margin-left:0; position: relative; padding-right: 18px;position: relative;}
.TOP_LINKS>a:nth-of-type(1)>span{color:#e70012;display: inline-block;font-weight:bold;padding: 5px;position: absolute;right:0;}
.TOP_LINKS>a:nth-of-type(2){color:#e60012;}
.TOP_LINKS>a:nth-of-type(4){float:left;background: #e70012;color:#fff;padding:5px 10px;margin-right:10px;margin-left:10px;}
.NAV li{float:left;font-weight: bold;}
.NAV li:first-of-type{margin-left:0}

#SEARCH{float:right;}
#SEARCH input{border:none !important;}
#SEARCH>input:first-of-type{background: #e9e9e9;padding: 6px !important;margin-top:0;}
#SEARCH .BTN{background: #e70012 url(../images/search.png) center center no-repeat;width:10px;height:28px;border-radius: 0;margin:0}
#SEARCH .BTN:hover{background: #e70012 url(../images/search.png) center center no-repeat;}
.search{display:inline-block;position: absolute;
    right: 7px;
    top: 3px;
    padding: 4px !important;}
.search input{padding:5px;}



/*--footer--*/

footer{padding:25px 10px;text-align: center;color:#666;border-top:1px solid #ccc;margin-top:30px;}
.FOOTER{width:90%;margin:0 auto;}
.COUNT{float:right;font-size:14px;}

#backtop {
    position: fixed;
    bottom: 40px;
    right: 20px;
    margin: 0;
    padding: 0;
    z-index: 9999;
}




/*--首頁 index--*/
.HOME_CONTAINER{width:85%;margin:3em auto 1em}
.HOME_CONTAINER .MORE{color:#a3cc5a;border:1px solid #a3cc5a;padding:5px 12px;display: inline-block}


.AD{width:16.5%;float:right;}
.BANNER{width:83.5%;float:left;}
.BANNER>.bxslider{padding:0px;margin:0px;}
.BANNER li{	list-style:none;}
.BANNER img{margin:0 auto;}
.BANNER .bx-controls-direction{display: none;}

.AD>div>img:last-of-type{display: none;}
.AD li{list-style: none;}
.AD a:hover{opacity:0.9;}

.HOME_TITLE{font-size:1.4rem;letter-spacing: 1px;}

.HOME_PRO{float:left;width:70%;}
.HOME_RIGHT{float:right;width:25%;}

.HOME_PRO>div:first-of-type{margin-bottom:30px;}
.HOME_PRO>div:first-of-type .HOME_TITLE{padding:10px 0 10px 40px;background: url(../images/homeicon01.png) left center no-repeat;}
.HOME_PRO>div:last-of-type .HOME_TITLE{padding:10px 0 10px 40px;background: url(../images/homeicon02.png) left center no-repeat;}
.HOME_PRO .img-shiv{height:auto;max-height: 100%;}
.HOME_PRO .bx-pager{display: none;}

.HOME_PRO .bx-wrapper .bx-prev{left:-50px}
.HOME_PRO .bx-wrapper .bx-next{right:-50px}
.HOME_PRO h3{font-weight:normal;padding:7px;}
.HOME_PRO .PRICE{color:#e70012;font-family:Avant Garde-Book;font-size:1.3em;}
.HOME_PRO a:hover .img-contain{border:1px solid #e60012;}


.HOME_NEWS .HOME_TITLE{margin-bottom:10px;color:#e60012;font-weight:normal;}
.HOME_NEWS li{border-bottom:1px solid #e60012;}
.HOME_NEWS li a{display: inline-block;height:40px;line-height: 40px; overflow: hidden;}
.HOME_NEWS li a:hover{color:#e60012;}
.HOME_NEWS .BTN{color:#e70012;text-align: right;margin:10px 0;background: none;float:right;}
.HOME_NEWS .BTN:hover{background: none;color:#000;}
.HOME_NEWS{margin-bottom:30px;}


.HOME_STORE{border:1px solid #ddd;padding:5px;}
.HOME_STORE>ul>li{background: #f4f4f4;text-align: center;padding:15px 0;}
.HOME_STORE>ul>li:nth-of-type(even){background: #ececec;}
.HOME_STORE>ul>li>div:nth-of-type(1){font-size:17px;font-weight:bold;}
.HOME_STORE>ul>li>div:nth-of-type(2){color:#e70012;font-size:19px;font-style: italic;line-height: 35px;}
.HOME_STORE>ul>li>div:nth-of-type(2):before{content:url(../images/icon-phone.png); margin-right:12px;}
.HOME_STORE>ul>li>div:nth-of-type(3){font-size:13px;color:#333;}
.HOME_STORE .EMAIL{background: #e70012;color:#fff;text-align: center;padding:10px 0;}
.HOME_STORE .EMAIL:before{content:url(../images/icon-email.png); margin-right:12px;}




/*--內頁--*/
.CONTAINER{line-height:160%;padding:30px 0 40px;min-height: 250px;}

.TITLE{color:#e60012;text-align: center;padding:20px 0 40px;font-weight: bold;letter-spacing: 2px;font-size:1.8rem}
.SUBTITLE{font-size:1.3em;color:#e70012;margin-bottom:20px;letter-spacing: 0.5px;}

.DETAIL_TITLE{ font-size:17px; font-weight:bold; padding:10px 0px; margin-top:15px; margin-bottom:12px; line-height:100%; border-bottom:1px dotted #888; letter-spacing: 1px;}
.PAGE_SUBTIILE{padding: 5px 10px;margin:20px 0;font-size:16px;border-left:3px solid #e3b9bb;
    /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f8d7e0+0,fceaef+100 */
    background: #f8d7e0; /* Old browsers */
    background: -moz-linear-gradient(left,  #f8d7e0 0%, #fceaef 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left,  #f8d7e0 0%,#fceaef 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right,  #f8d7e0 0%,#fceaef 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8d7e0', endColorstr='#fceaef',GradientType=1 ); /* IE6-9 */
}
.DETAIL_DATE{color:#666}

.ABOUT .TABLE{margin:0 auto;width:80%;}
.ABOUT .TABLE th{background: #efefef;font-size:16px;}
.ABOUT .TABLE{text-align: center;}
.ABOUT .TABLE tr:nth-of-type(odd),
.ABOUT .TABLE tr:nth-of-type(odd) td{background: #f6f6f6;}








/*--最新消息 news--*/
.LIST_NEWS{width:850px;margin:0 auto !important;}
.LIST_NEWS li{border-bottom:1px solid #ccc;padding-left:20px !important;background: url(../images/icon.png) left center no-repeat;}
.LIST_NEWS .LIST_LEFT{font-style:italic;color:#e70012;margin-right:20px;}




/*--搜尋結果 search--*/
.SEARCH{padding-left:20px}
.SEARCH li{margin-bottom:5px;}
.SEARCH li a{text-decoration: underline;}




/*框固定 圖片自動縮放*/
.img-contain {
    width: 100%;
    height: 0;/*讓元素的高度=padding-bottom*/
    padding-bottom: 100%;

    position: relative;
    border:1px solid #ddd;
}

.img-contain img{
    max-width:100%;
    height:auto;
    /* max-height: 100%; */
    vertical-align: middle;
    margin:0 auto;
}

.img-shiv {
    position: absolute;
    width: 100%;
    height: 100%;
    font-size: 0;
}

.img-shiv:before {
    content: "";
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.img-shiv.font {
    font-size: inherit;
}


/*--產品介紹 products--*/

/*.LIST_PRO .img-shiv{height:auto;}
.LIST_PRO li h3{font-size:15px;padding:5px 0;text-align: center;max-height:60px;}
.LIST_PRO .PRICE{color:#e70012;font-family:Avant Garde-Book;text-align: center;font-size:1.3em;}*/

.PRO{width:800px;margin:0 auto;}
.PRO div.domtab>div{padding:0.5em 2em;}

.PRO_LIST .tabs{margin-bottom:20px}
.PRO_LIST .tabs li{float:left;margin-right:10px;margin-bottom:10px;list-style: none;}
.PRO_LIST .tabs a{display: inline-block;padding:5px 10px;background: #aaa;color:#fff;}
.PRO_LIST{width:800px;margin:0 auto;}
.PRO_LIST .LIST li>a{display: inline-block;font-size:0.9em;background: #e70012;padding:3px 15px;float:right;color:#fff;}
.PRO_LIST .LIST>li{border-bottom:1px solid #ddd;}
.PRO_LIST .LIST>li:last-of-type{border-bottom:none;}
.PRO_LIST .LIST h3{display: inline-block;width:50%;}
.PRO_LIST .LIST .PRICE{display: inline-block;width:15%;color:#e70012;font-weight:bold;font-size:18pt;text-align: center;}
.PRO_LIST .LIST .PRICE+.PRICE{color:#ff5722;}
.PRO_LIST .LIST>li:first-of-type>div{float:left;}
.PRO_LIST .LIST>li:first-of-type>div:nth-of-type(1){width: 50%;}
.PRO_LIST .LIST>li:first-of-type>div:nth-of-type(2),
.PRO_LIST .LIST>li:first-of-type>div:nth-of-type(3){
    width:15%;text-align: center;
}
.PRO_LIST .LIST>li:first-of-type span{display: inline-block;margin-left:5px;}
.PRO_LIST .BOX{margin-bottom:30px;background: #f8f8f8;padding:5px 20px;}


.TITLE_PRO{margin-bottom:15px;}
.TITLE_PRO>p{line-height: 30px;}
.BOX_PRICE{padding:15px 0;margin:15px 0;border-top:1px solid #ccc;border-bottom:1px solid #ccc;}
.BOX_PRICE>p:nth-of-type(1)>span{color:#666;display: inline-block;margin-left:10px;}
.BOX_PRICE>p:nth-of-type(2)>span{color:#e70012;font-size:18px;display: inline-block;margin-left:10px;}
.BOX_PRICE>p{line-height: 35px;}
.BOX_PRICE>ul li{float:left;margin-right:5px;margin-bottom:5px;list-style: none;padding:5px;text-align: center;color:#fff;font-size:14px;}
.BUY{padding-top:10px;margin-top:15px;border-top:1px solid #ddd;}
.BUY>a{margin-left:10px;}
.BUY>a:nth-of-type(1){padding-left:25px;background: #aaa url(../images/icon-add.png) 10px center no-repeat}
.BUY>a:nth-of-type(2){padding-left:28px;background: #e60012 url(../images/icon-cart.png) 10px center no-repeat;}
.BUY select{margin-top:15px;}
.BOX_SPEC{width:90%;margin:0 auto;background: #fff;}
.BOX_SPEC>h4{text-align: center;font-weight:bold;line-height: 35px;background: #c6f4d7;font-size:17px;}
.BOX_SPEC table{float:left;width:50%;}
.BOX_SPEC table tr:nth-of-type(even){background: #f4f4f4;}
.aa{background:#3d8ce3; }
.bb{background:#fb9d51; }
.cc{background:#df463b; }
.dd{background:#7bbd36; }
.ee{background:#9c2875; }

.accordionPart>li{list-style: none;}
#qaContent>ul>li{padding:5px;}
#qaContent>ul>li>div:first-of-type span{color:#e70012;}
.qa_content{padding:5px 0 5px 25px;}



/*--門號折扣 discount--*/
.DIS .TABLE th, .DIS .TABLE td{text-align: center;}
.LIST_DIS li{list-style: none;margin-bottom:50px;}
.LIST_DIS{min-width:800px;margin:0 auto;}
.LIST_DIS li thead{background:#;}
.LIST_DIS li thead>tr>th:nth-of-type(2){color:#2d76c6;}
.LIST_DIS li thead>tr>th:nth-of-type(3){color:#e60012;}
.LIST_DIS li thead>tr>th:nth-of-type(4){color:#690;}
.LIST_DIS li thead>tr>th:nth-of-type(5){color:#e60012;}
.LIST_DIS li thead>tr>th:nth-of-type(6){color:#;}
.LIST_DIS li thead>tr>th:nth-of-type(7){color:#af49c2;}

.DIS .TABLE{border:1px solid #eee;}
.DIS .TABLE tbody>tr:nth-of-type(odd),
.DIS .TABLE tbody>tr:nth-of-type(odd) td{ background-color: #f9f9f9;}
.DIS .TABLE>tbody>tr>td, .DIS .TABLE>tbody>tr>th{border-top: 1px solid #ddd;}



.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd;
}




/*--聯絡我們 contact--*/
.LIST_CONTACT{width:500px;margin:0 auto !important;}
#contactform input[type="text"],
#contactform input[type="email"],
#contactform textarea{width:100%;}




/*----模 組----*/

/*左右*/
.LEFT{float:left;}
.RIGHT{float:right;}
.LEFT_50{ float:left;width:47.5%;}
.RIGHT_50{ float:right;width:47.5%;}
.LEFT_40{ float:left;width:37.5%;}
.RIGHT_60{ float:right;width:57.5%;}
.LEFT_IMG{float:left;margin-right:10px;}
.RIGHT_IMG{float:right;margin-left:10px;}


/*列表*/
.LIST{ padding:0; margin:0; padding-bottom:5px; overflow:auto; list-style-type:none;}
.LIST>li{padding:8px 0; overflow:auto;vertical-align:top;}
.LIST li *{ vertical-align: middle;}
.LIST_LEFT{ display:block; float:left; margin-right:5px; vertical-align:top;}
.LIST_RIGHT{ display:block; overflow:auto; vertical-align:top;}



/*圖文列表*/
.COLUMN3, .COLUMN4{ padding:0; margin:0; list-style-type:none; margin-left:-1%; margin-right:-1%; }
.COLUMN3>li, .COLUMN4>li{display:inline-block; list-style: none; vertical-align:top;margin-right:1%; margin-bottom:20px;}
.COLUMN3>li{ width:30.5%; margin-left:1%; }
.COLUMN4>li{ width:22.5%; margin-left:1%; }




/*表單*/
input[type="text"],
input[type="email"],
textarea,
select{ padding:7px 3px;padding-left:1.5%; padding-right:1.5%; border:1px solid #aaa;font-family:"微軟正黑體"; outline:none; vertical-align:top; /*border-radius: 3px;*/max-width: 98%;margin:1px 0}

textarea{width:400px;}
.CODE{width:inherit !important; margin-right:5px !important;}


/*按鈕*/
.BTN{
    border:none;cursor:pointer;color:#fff;background:#e60012;padding:5px 17px;margin-top:15px;display: inline-block;
    -webkit-appearance: none;
}
.BTN:hover{transition: background .3s ease-out ;-moz-transition: background .3s ease-out;-webkit-transition: background .3s ease-out; -o-transition: background .3s ease-out; background: #ccc;}


/*---頁碼---*/
.PAGES{margin-top:20px}
.page{text-align:center; margin:30px 5px 0; color:#666;}
.page.active{background:#aaa; padding:0px 5px; color:#fff; border-radius:3px; -webkit-border-radius:3px;}



/*---公用---*/
.HTML img{max-width: 100%;}
.CENTER{text-align:center;}

.TABLE th{text-align: center;}
.TABLE th, .TABLE td{padding:5px 10px;}

.PADDING10{padding:10px;}
.PADDING20_0{padding:10px;}
.MARGIN_TOP20{margin-top:20px;}
/*.MARGIN_BOTTOM10{margin-bottom:10px;}
.MARGIN_BOTTOM20{margin-bottom:20px;}*/

.RED{color:#e60012}



/*----------------RWD----------------*/

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

}

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

}

@media screen and (max-width:1200px) {
    .HEADER>.RIGHT{margin-right:0;}
    .NAV li>a{padding:15px;}
}

@media screen and (max-width:1024px) {
    .NAV{display: none;}
    .MENU2{display: block;}
    .HEADER_BG {background: #e70012;}
    .LOGO{float:none;width:100%;text-align: center;}
    .HEADER>.RIGHT{position: absolute;top:0;right:0;}
    .HEADER_TOP{width:auto;}
    .TOP_LINKS {
        display: none;
        color:#e70012;background: #fff;
    }
    .CONTAINER{width:90%;}
    .BOX_SPEC{width:100%;}

    .HTML{overflow-x: scroll;}

}


@media screen and (max-width:880px) {
    .HOME_PRO, .HOME_RIGHT{float:none;width:100%;margin-top:50px;}
    .LIST_NEWS{width:100%;}
    .PRO_LIST{width:100%;}
    .PRO_LIST .LIST h3, .PRO_LIST .LIST .PRICE{font-size:16px;}
}


@media screen and (max-width:800px) {
    .BOX_SPEC{width:100%;}
    .BOX_SPEC table{float:none;width:100%;}
    .BOX_SPEC>table:last-of-type tr:nth-of-type(even){background:none;}
    .BOX_SPEC>table:last-of-type tr:nth-of-type(odd){background: #f4f4f4;}
}

@media screen and (max-width:768px) {
    .LOGO{float:none;text-align: center;}
    .BANNER, .AD{float:none;width:100%;} 
    .AD>div, .AD li{float:left;width:25%;}
    .AD>div>img:last-of-type{display: block;}
    .AD>div>img:first-of-type{display: none;}
    .HEADER_TOP{display: none;}
    .HOME_TITLE{font-size:1.3rem;}
    .HOME_PRO h3,
    .HOME_PRO .PRICE{font-size:1em !important;}

    .ABOUT .TABLE{width:100%;}
    .LEFT_40, .RIGHT_60{float:none;width:100%;}
    .PRO .LEFT_40{width:70%;margin:0 auto 30px;}
    .LIST_PRO li{width:47%;}


    .TITLE, .MENU2{display: block}
    textarea{width:100%;max-width: 100%}


    .LEFT_MENU{float:none;margin-bottom:20px;}
    .LEFT_MENU>li{float:left;border-bottom:none;margin-right:1px}
    .HTML ul{padding-left:20px;}
    
}


@media screen and (max-width:550px) {
    .LIST_LEFT{float:none;}
    .LIST_CONTACT{width:100%;}
    .PRO_LIST .BOX{width:500px;}
    .PRO_LIST{overflow-x: scroll;}
}

@media screen and (max-width:480px) {
    .HOME_CONTAINER{margin-top:2em}

    .TITLE {padding-top:0;}

    .bx-wrapper .bx-prev{left:-20px !important;}
    .bx-wrapper .bx-next{right:-20px !important;}

    .PAGES{display:none;}

    .BUY select{display: block;}
    .BUY>a:first-of-type{margin-left:0;}
}


@media screen and (max-width:375px){
    input[type="text"]{width:100%;max-width: 100%}
    .CODE{margin-left:0;margin-top:5px;}

    .PRO_LIST .LIST>li:first-of-type span{display: none;}
    .PRO_LIST .LIST li>a{padding:3px 5px;}
    .PRO_LIST .LIST h3 a{font-size:15px;line-height: 16px;}
}