input {
    margin: 0;
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

/*---------------------

選單
------------------*/
.sidebar-box{
	float:left;
 width:28%;
  position:relative; 
  margin-bottom: 30px;
}
.asideMenu{
    padding:0;
    background:#fff ;
    display: block;
    box-sizing: border-box;
	margin-bottom:30px
   
}

.asideMenu h3{ 
     margin: 0;
    outline: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
 	background:#f3f5fa;
    font-size:20px;
    padding: 13px 30px 15px;
	border-left:#ddd 1px solid;
	border-right:#ddd 1px solid;
	border-top:#ddd 1px solid;
	
	}
.tabs { 
	width:100%;   
   list-style: none; 
    list-style: none;
	padding:0;
	margin:0;
	}

.tabs  > li {
   display: block;
    margin: -1px 0 0;
    border:#ddd 1px solid;
    text-align: left;
	 line-height:35px;

}
.tabs > li > a {
  color: #222;
  padding:15px 10px;
  display: block;
  max-width:100%;
  margin: 0 auto ;
  position: relative;
  letter-spacing: .1em;
  text-decoration:none;
  font-size:16px
   
}

.tabs > li > a:hover{
	background:#f3f5fa;
    color:#2f6f9f; 
	text-decoration:none ;
	font-weight:bold
}




.mDropdownBox  { display:none}

@media (max-width:991px) {
.asideMenu {background-color:transparent}
.asideMenu h3{ display:none}
.tabs{ display:none}
.sidebar-box{
    flex: 0 0  100%;
	  float: none;
    width: 100%;
    max-width: 100%;
  }

.mDropdownBox {
    position: relative;
    display: block;
}


 

  .mDropdownBox > ul a {
    display: block;
    padding: 10px;
  }

  .mDropdownBox > ul{

	margin: 0;
    padding: 0;
    display: inline-block;
    background: #fff;
    width: 100%;
    border: #ddd solid 1px;
    margin-top: -1px;
}
    
  }
  .mDropdownBox > ul a {
    padding-left: 2em;
    color: #222;
  }
  .mDropdownBox > ul ul a:before, .mDropdownBox > ul ul a:after {
    display: block;
  }
  .mDropdownBox.open > div::after {
    -webkit-transform: rotateX(-180deg);
            transform: rotateX(-180deg);
  }

  
  .ctBox{ 
    position: relative;
    padding: 15px 10px;
    border: #ddd 1px solid;
   cursor: pointer; 
	 line-height:30px;
    font-size:18px;
    background:#ecf0f1;
    overflow: hidden;
    text-align:center
}
  .ctBox::before {
    content: '';
    position: absolute;
    width: 1px;
    height: 100%;
    top: 0;
    right: 40px;
    background-color: #ddd;
  }
  
  .ctBox::after {
    content: '';
    position: absolute;  
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    -webkit-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
	font-family: FontAwesome;
    font-size:20px;
       top:1.25em;
    right:.563em;
    width: .688em;
    height: .688em;
    margin-top: -0.250em;
    margin-left: -.375em;
    border-bottom: 0.063em solid #454545;
    border-right: 0.063em solid #454545;
    transform: rotate(45.01deg);
}
 
  .mDropdownList > li > a {
    border-bottom: 1px solid #ddd;
  }

 .mDropdownList > li > a:hover{	
 background:#f3f5fa;
    color:#2f6f9f; }




/*------------------------------

右側


------------------------------*/

.page-col-right {
  width:69%;
  margin-left: auto;
  margin-right: 0;
  position:relative
}
@media (max-width:991.88px) {

 .page-col-right { float: none;width: 100%; max-width: 100%; flex: 0 0  100%; }
}




.detailWapper {

    padding: 0 10px;
    margin-top: -25px;
	display:block
}


/*---------------------------------------------
   list search
  ---------------------------------------------  */

.form-field {
    display: block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.input-group {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 200px;
       z-index: 2;
}

.pro-form {
    padding: 10px 8px 10px 8px;
    max-width: 100%;
    width: 100%;
}

    .pro-form .form-group {
        position: relative;
        width: 100%;
        display: block;
        margin-top: auto;
        -ms-flex-item-align: stretch !important;
        align-self: stretch !important;
        -webkit-box-align: end !important;
        -ms-flex-align: end !important;
        align-items: flex-end !important;
    }

/*-----------------------------

        列表
-----------------------------*/
.breadcrumb{
	background-color:#CCC;
    margin-top: 0px;
	list-style:none;
	list-style-type:none;
	margin:0;
	padding:0
}
.pro_tit_all {
    margin: 0 auto;
    font-size: 15px;
    padding:20px 0 10px;
       display: inline-block;
	   float: left;
}

    .pro_tit_all a {
        color: #222;
    }

        .pro_tit_all a:hover {
            color:#2f6f9f; 
        }


/*-----------------------------

        細項
-----------------------------*/
.pro_tit_1ist {
    margin: 0 auto;
    font-size:16px;
    padding:20px 0 10px;
    display: inline-block;
    font-weight: inherit;
	float: left;
}

    .pro_tit_1ist a {
        color:#2f6f9f; 
    }

        .pro_tit_1ist a:hover {
           color: #222;
        }

    .pro_tit_1ist:before {
        padding: 0 5px;
        color: #ccc;
        content: "/";
    }

.booking-form .form-group label {
    cursor: pointer;
    font-weight: 400;
    padding-bottom: 5px;
    font-size: 15px;
    padding-left: 3px;
    color: #1a1e49;
    font-weight: bold;
    text-align: left;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-family: '微軟正黑體', sans-serif, Arial, serif;
    display: inline-block;
}

.pro-form .form-group .icon {
    cursor: pointer;
    position: absolute;
    top: 50% !important;
    right: 0;
    font-size: 14px;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
}

    .pro-form .form-group .icon span {
        color: #000;
        cursor: pointer;
        color: black !important;
    }

        .pro-form .form-group .icon span:before {
            cursor: pointer;
            border-bottom: 2px solid #999;
            border-right: 2px solid #999;
            content: '';
            display: block;
            height: 5px;
            margin-top: -4px;
            pointer-events: none;
            position: absolute;
            right: 12px;
            top: 50%;
            -webkit-transform-origin: 66% 66%;
            -ms-transform-origin: 66% 66%;
            transform-origin: 66% 66%;
            -webkit-transform: rotate(45deg);
            -ms-transform: rotate(45deg);
            transform: rotate(45deg);
            -webkit-transition: all 0.15s ease-in-out;
            transition: all 0.15s ease-in-out;
            width: 5px;
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            text-rendering: auto;
            line-height: 1;
            -webkit-font-smoothing: antialiased;
        }


.pro-form .form-group .wrap {
    cursor: pointer;
    width: 100%;
    display: block;
    margin-bottom: 20px;
    font-size: 14px;
}

.pro-form .form-group .select-wrap, .pro-form .form-group .input-wrap {
    position: relative;
    cursor: pointer;
}

    .pro-form .form-group .select-wrap select, .pro-form .form-group .input-wrap select {
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        cursor: pointer;
    }

.pro-form .form-group .btn {
    cursor: pointer;
    width: 100%;
    display: block !important;
    cursor: pointer;
}


.pro-form .form-control::-webkit-input-placeholder {
    /* Chrome/Opera/Safari */
    color: black;
    cursor: pointer;
}

.pro-form .form-control::-moz-placeholder {
    /* Firefox 19+ */
    color: black;
}

.pro-form .form-control:-ms-input-placeholder {
    /* IE 10+ */
    color: black;
    cursor: pointer;
}

.pro-form .form-control:-moz-placeholder {
    /* Firefox 18- */
    color: black;
    cursor: pointer;
}

.pro-form .form-control:focus, .pro-form .form-control:active {
    border-color: #fff;
}



/*---選取---*/

.pro-form .form-control-select {
    height: 40px !important;
    padding-left: 7px;
    padding-right: 7px;
    color: black !important;
    border-radius: 0px;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    font-family: '微軟正黑體', sans-serif, Arial, serif;
    border: 1px solid #ddd;
    width: 100%;
    text-align: left !important;
    font-size: 14px;
    width: 100%;
    background-clip: padding-box;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
    color: #000;
    cursor: pointer;
}


    .pro-form .form-control-select:focus {
        box-shadow: none;
        border-color: #777;
    }

    .pro-form .form-control-select:hover {
        box-shadow: none;
        border-color: #777;
    }






.form-control {
    display: block;
    width: 100%;
    padding: .375rem .375rem;
    font-size:14px;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ddd;
    -webkit-transition: border-color .15s ease-in-out , -webkit-box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out , -webkit-box-shadow .15s ease-in-out;
    -o-transition: border-color .15s ease-in-out , box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out , box-shadow .15s ease-in-out;
    transition: border-color .15s ease-in-out , box-shadow .15s ease-in-out , -webkit-box-shadow .15s ease-in-out;
}


/*-------------------
尋找
--------------------*/

.input-group {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    width: 100%;
}


.searcher {
    position: relative;
    width: 100%;
    display: block!important;
      background-clip: padding-box;
    border: 1px solid #ddd;
    margin-top: auto;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    top:-20px;
    margin-top: auto;
}

@media (max-width:800px) {
.searcher {
	     width:100%;
         margin:auto;
         cursor: pointer;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap; 
		top:0px;
    }
}



.searcher .form-control:focus, .searcher .form-control.focus, .searcher .searchIcon:focus, .searcher .searchIcon.focus {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
	}

 .searcher .form-control {
    border: none;
	outline:none;
	height:40px
}



 .searcher .searchIcon {
    padding-top: 0;
    padding-bottom: 0;
    background-color: transparent;
}

  .searcher .searchIcon:before {
        content: "";
		background:url(../images/icon/search.png);
        font-size: 1.5rem;
        color: #6c757d;
       
        display: inline-block;
        vertical-align: middle;
        padding-right: 0;
		height:30px;
		width:30px
    }

@media (max-width:991.98px) {
    .searcher .searchIcon:before {    
        font-size: 1.5rem;
        color: #6c757d;
             display: inline-block;
        vertical-align: middle;
        padding-right: 0;
        line-height: 0;
    }
}







@media (max-width:1199.98px) {
    .searcher > .input-group {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }
}

.sarchbtn {
	border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    padding: .375rem .375rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: .25rem;
	cursor:pointer
}


.input-group-append {
    margin-left: -1px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    position: absolute;
    right:1px;
    top: 5px;
}

/*==========================================
product list item
===========================================*/
.page_productList {
    box-sizing: border-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    transition: all .5s ease-out;
}



.page_productList > li {
    vertical-align: baseline;
    margin-bottom: 30px;

}


    .page_productList > li {
        width: calc(100% / 3);
        width: 33.33333333%;
		 padding-left:7px;
        padding-right:7px;
    }


@media screen and (max-width:1180px) {
    .page_productList > li {
        width: 49.33%;
        padding-left: 6px;
        padding-right: 6px;
    }
}


@media screen and (max-width:550px) {
 .page_productList > li {
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
}

}

.page_productList {
    list-style: none;
    list-style-type: none;
    left: 0;
    margin: 0;
    padding: 0;
}

    .page_productList .pro_card{
        position: relative;
        max-width: 100%;
        width:100%;
        margin-left: auto;
        margin-right: auto;
        padding-bottom: 15px;
        background-color: #fff;
        margin-top:15px;
			    background: #fff;
       border-radius: 4px;
	  border:#ddd solid 1px;
       box-shadow: 0 1px 3px rgba(0,0,0,.1);
         }


    .page_productList .Img ::before {
        content: "";
        display: block;
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
    }

    .page_productList .pro_card:hover {
        -webkit-box-shadow: 0px 2px 29.4px 0.6px rgba(0, 0, 0, 0.1);
        box-shadow: 0px 2px 29.4px 0.6px rgba(0, 0, 0, 0.1);
    }





 .page_productList .Txt {
        padding: 10px 8px;
              text-align: center;
		 display: block;
		  max-width:100%;
		
    margin: 0 auto;
    }



.subject{
	word-break: break-word;
    text-align:center;
    font-size: 15px;
    height: auto;
    min-height:55px;
    margin: 0;
	padding:0;
    line-height: 1.4em;
     -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
@media screen and (max-width:550px) {
	.subject {	
		text-align: left;
    font-size: 15px;
    display: block;
    display: -webkit-box;
    height: auto;
    max-height:55px;
    margin: 0 auto;
    line-height: 1.4;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
	word-break: break-word;
    text-overflow: ellipsis;
	}
	
}
    /*--------------------------
    下拉選取
  --------------------------*/
    .page_productList select {
        width: 80% !important;
        line-height: 25px;
        padding: 3px 10px!important;
        padding: 5px;
        margin-bottom: 5px;
        font-size: 15px;
        letter-spacing: 1px;
        padding-right: 15px;
        border-radius: 2px;
        border: 1px solid #ddd;
        margin: 0;
        font-size: 15px;
        color: #6d6d6d;
        position: relative;
        background-color: #FFF;
        z-index: 1;
    }
	
	
	 /*--------------------------
    產品title
  --------------------------*/
.itemlink {
    line-height: 1.8;
    color: #222;
    font-size:15px;
    font-weight: 600;
}



.itemlink:hover {
    color: #2f6f9f;
	text-decoration:none
}
.itemlink:focus {
	  color:#2f6f9f;
	text-decoration:none
}
 
/*--------------------------
 定價/ 特價
  --------------------------*/
 .delline {
    text-decoration: line-through;
	font-size:15px;
}


.sellprice {
    color: #ea6e6e !important;
    font-size:15px ;
}



 .pricearea {
    text-align: center;
    margin-bottom: 10px;
}

 .price {
    display: block;
    color: #818181;
    margin: 0 5px;
}


/*----規格數量Area----*/
.stands_options   {
     position: relative;
    width: 100%;
    padding: 3px 0;
    margin: 0 3px;
}
.standarea {
    display:block;
    position: relative;
    min-height: 45px;
    overflow: hidden;

}
/*---規格----*/
    .stands_div {
        float:none;
        width: 100% ;
        margin-bottom:8px;
    }


/*----規格數量Box----*/


 .options {
      position: relative;
    width: 95%;
    padding: 3px 0;
    margin: 0  auto 10px auto;
}




.product_name {
    line-height: 2.5;
    font-weight: bold;
    text-align:left;
    box-sizing: border-box;
	font-size:15px}

/*---buyBTN----*/
.buybtn {
    display:block;
    cursor: pointer;
    width: 45%;
    margin: 8px auto;
    padding:5px 0;
    line-height: 24px;
    color: #fff;
    background-color:#343a40;
    text-align: center;
    border-radius:4px;
    margin: 0 auto;
    transition: 0.4s ease;
	font-size:15px
}

.buybtn:hover {
        opacity: 0.8;
    }
.buybtn {
    display:block;
    cursor: pointer;
    width: 45%;
    margin: 8px auto;
    padding:5px 0;
    line-height: 24px;
    color: #fff;
    background-color:#343a40;
    text-align: center;
    border-radius:4px;
    margin: 0 auto;
    transition: 0.4s ease;
	font-size:15px
}
.buybtn a {
	text-decoration:none;
	color:#fff !important
    }
.buybtn a:hover {
	text-decoration:none;
	color:#fff
    }

    /*--------------------------
    產品相片
  --------------------------*/
 .page_productList  .Img {
    z-index: 1;
    position: relative;
    padding: 0;
    margin: 0;
    -webkit-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    height:255px;
    overflow: hidden;
    position: relative;
    width: 100%;
    background-color: #F5F7FA;
	cursor:pointer
}

    .page_productList .Img img {
        display: block;
        max-width: 100%;
        width: 100%;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
    
        height: auto;
        -o-object-fit: cover;
        object-fit: cover;
        margin: auto;
        text-align: center;
        padding: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        border-style: none;
        vertical-align: middle;
		    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2);
    }


/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

		產品內頁介紹   
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* -----產品相片區 ----- */
.introBox-Left{
	float:left;
	margin-top:15px;
	width:40%;}
@media screen and (max-width: 870px) {
.introBox-Left{	width:100%;}
}
	
/* -----產品介紹文字----- */
.introBox-Right{overflow:hidden;float:right; width:55%}

@media screen and (max-width:1024px) {
.introBox-Right{overflow:hidden;float:right; width:45%}
	

}

	
@media screen and (max-width: 870px) {
.introBox-Right{float:left;width:100%}

}
/*----產品最大圖區-----*/
.introBox-Left .Img{
	cursor: pointer;
	width:100%;
	border: 1px solid #DEDEDE}

/*----產品img輪撥區-----*/
.goodside-ImgBox{width:100%;float:left;	}

/*----下方產品小圖輪撥區-----*/
ul.side_album{
	margin:0;
	padding:0;
	margin-top:10px;
	list-style-type:none;
	list-style:none;
	width:100%;}

ul.side_album li{ 
   list-style: none;
	float:left;
	max-width: calc(100%/4.7);
	margin-right:2%;
	 margin-bottom:5px;
	overflow:hidden;
	border: 1px solid #E0E0E0;}


	
ul.side_album li a img{
	display:block;
	width:100%;}


@media screen and (max-width: 800px) {
ul.side_album li { margin-bottom:10px}
}

/*產品名大標*/
.productTitle {
   margin-bottom: 5px;
    padding-bottom: 5px;
    font-family: '微軟正黑體',Helvetica,Arial,Heiti TC,"メイリオ",sans-serif;
    font-size: 22px;
    color: #262626;
    border-bottom: 1px solid rgba(0,0,0,.125);
    font-weight: 600;
    line-height: 1.45em;
    margin-top: 0;
    display: block;

}
/*小標 */
.introspan{color:#2f6f9f;font-size:17px; font-weight:bold}


/*商品編號*/


/*商品的簡略介紹*/
.product-slogan{
	margin-top:10px;
	color:#6C6C6C;
	line-height:1.45em;
	display:block;
		vertical-align:middle;
	font-size:15px;
	line-height:1.6;
	    height:65px;
    overflow: hidden;
	padding-left:5px;
	padding-right:5px;
	padding-bottom:5px
	}	

/*----右邊的table列表----*/	

.order-prointro{
	margin:auto;
	width:100%;
    border-collapse: collapse;
	font-size:15px;}

.order-prointro td,.order-prointro th {
    padding:0 5px;

}

.order-prointro  tr {
    border: 0px;
}

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

.order-prointroo{width:100%;height:auto }	

 .order-prointro th { display: none; }
}

/*----右邊的table內容物----*/	
.product-element{
	line-height:1.7;

	overflow:hidden;
	}	

.price_page{
	color: #818181;
    margin: 0 5px;
	display:inline-block}
.prizevalue{
	font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    color:#ea6e6e;
    padding-left: 0.2em;
    text-align: center;
    font-size: 1.3em;
}

/*--------------------
    coupon
    
---------------*/
.couponBox {
    width:100%;
    margin: 0px auto;
    font-size:14px;
    line-height: 1.2;
    display: table;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 5px;
    color: #333;
	border:#ddd solid 1px;
	padding:0}


.couponBox i{ font-style:normal; text-align:center;display: block;}

.coupon-text {
    display: table-cell;
    border-right: 1px dashed #ddd;
    padding:5px 3px;
    vertical-align: top;
    width: 20%;
    padding-right: 5px;
}

.coupon-sub-text {
   display: table-cell;
    text-align: center;
    width: auto;
    font-style: normal;
}

.coupon-nu-text {
   display: table-cell;
    text-align: center !important;
    color: #ff3368;
    width: auto;
    font-style: normal;
}

.coupon-desc {
    vertical-align: top;
    vertical-align: bottom;
    border-right: none;
    width: 35%;
    border-right: 1px dashed #ddd;
    padding:5px 3px;
    text-align: center;
   display: table-cell;
}

.d-price-desc {
    text-align: center;
   display: table-cell;
    vertical-align: bottom;
    border-right: none;
    width:50%;
    padding: 6px 3px;
    vertical-align: top;
}


.biggerTxt {
    font-size: 18px;
   color: #ea6e6e;
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
     font-weight: bold;
}


.couponBtn {
	    margin-right: 5px;
    display:block;
    width:65px;
    vertical-align: top;
    padding: 6px 5px;
    cursor: pointer;
    background:#283d58;
    border-radius: 3px;
    color: #fff;
    text-align: center !important;
	font-size:12px;
	margin-top:18%
  }
    .couponBtn a {
        border-radius: 3px;
        display: block;
        line-height: 1.2;
        border-radius: 3px;
        color: #fff;
        vertical-align: middle;
        line-height: 1.2;
        font-weight: bold;
        font-size: 12px;
        text-align: inherit;
        text-align: center;
        -webkit-transition: 0.1s linear;
        transition: 0.1s linear;
    }

    .couponBtn:hover {
        background-color:#a1abb6;
    }
@media (max-width: 768px) {	
.couponBox {
    width: 100%;
    margin: 0px auto;
    font-size: 14px;
    line-height: 1.2;
    display: block;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    margin-bottom: 5px;
    color: #333;
    border: #ddd solid 1px;
    padding: 0;
    /* overflow: auto; */
}	
.coupon-text {
    display: inline-block;
     border-right:none;
    padding: 5px 3px;
    vertical-align: top;
    width: 50%;
    padding-right: 5px;
    float: left;
	line-height:3em
    /* overflow: auto; */
}	
.coupon-desc {
    vertical-align: top;
    vertical-align: bottom;
    border-right: none;
    width: 50%;
  border-right:none;
    padding: 5px 3px;
    text-align: center;
    display: inline-block;
    float: left;
    /* overflow: hidden; */
}
.d-price-desc {
    text-align: center;
    display: inline-block;
    vertical-align: bottom;
    border-right: none;
    width: 100%;
    padding: 6px 3px;
    vertical-align: top;
    /* float: left; */
    border-top: 1px dashed #ddd;
}
.couponBtn {
    margin-right: 5px;
    display: block;
    width: 120px;
    vertical-align: top;
    padding:8px 5px;
    cursor: pointer;
    background: #283d58;
    border-radius: 3px;
    color: #fff;
    text-align: center !important;
    font-size: 12px;
    /* margin-top: 18%; */
    /* float: left; */
    margin:8px auto;
    text-align: center;
}

}
/*---------------------
 Feature
-----------------------*/

 .kepbtnArea {
	 position: relative;
	  margin-bottom:5px;
    border-bottom: 1px dashed rgba(0,0,0,.125);
	 display: flex;
    clear: both;
	  width: 100%;
    max-width: 100%;
}

 .kepbtnBox {   
	text-align:center;
    width:95%;
	max-width:95%;
	display: inline-flex;
	padding:8px 10px 8px  10px;
	margin:0 auto
 }

.kepbtn {
	display: inline-block;
   min-width: auto;
	width:45%;
		height: 40px;
    line-height: 40px;
	margin-right: 2%; 
    color: #5a5a5a;
    cursor: pointer;   
	    border-radius: 3px;
    text-align: center;
        border: 1px solid #ddd;
        background-color: #fff;
    border-radius: 5px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-decoration: none;
     letter-spacing: 2px;
    font-size: 14px;   
}

.kepbtn:hover{ background-color:#f3f5fa;color:#2f6f9f; }


.kepbtn-icon {
    display: inline-block;
    vertical-align: middle;
     margin: 0 5px;
}


.icon-heart-gray-xs {
    background-image:url(../images/icon/fav_icons.png);
    background-position:center;
    width: 20px;
    height:20px;
}


.icon-heart-gray-xs:hover {
    background-image:url(../images/icon/hr_fav_icons.png);
	background-repeat:no-repeat;
     background-position: center;
    width: 20px;
    height:20px;
}

.icon-talk-gray-xs{
	background-image:url(../images/icon/talk_icons.png);
	background-repeat:no-repeat;
    background-position:center;
    width: 20px;
    height:20px;
	}
/*---------------------
 share
-----------------------*/
/*----分享----*/		
.product-shareArea {
 display: flex;
    width: 100%;
    max-width: 100%;
    position: relative;
    margin-bottom:5px;
    border-bottom: 1px dashed rgba(0,0,0,.125);
}

.product-shareArea ul{
    padding: 0;
	margin:0;
    left:0;
	list-style:none;
    list-style-type: none;
}


.product-shareArea li{
	padding:5px;
	float:left;
   text-align: center;
    list-style: none;
	}
.sharebtn{
	    background-repeat: no-repeat;
    cursor: pointer;
    background-position: center;
    background-size:100%;
    width: 28px;
    height: 28px;
	}
.share_introline{
	background:url(../images/introline.png);
	    background-position:center;
		background-repeat:no-repeat;
		border:none}

.share_introfb{
	background:url(../images/introfacebook.png);
	    background-position:center;
		background-repeat:no-repeat;
		border:none}


.share_introgoogle{
	background:url(../images/googleicon.png);
	    background-position:center;
		background-repeat:no-repeat;
		border:none}


.introig {
    background: url(../images/igicon.png);
    background-position: center;
    background-repeat: no-repeat;
    cursor: pointer;
	border:none

}

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

		產品選擇規格與 數量
		 
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
	
	.pd_option {
    display: inline-block;
    padding-top: 10px;
    padding-bottom:10px;
    background-color: #ededed;
    clear: both;
	width:100%
}
.p_specR{
    float: left;  
    display: inline-block;
}
.opt_label {
  display: inline-block;
    width:25px;
    font-size: 13px;
    color: #212121;
    margin-left: 12px;
    margin-right: 5px;
    padding-top: 5px;
	float:left
}
.sel_format {  
     float:left;
     width:auto;
   height: 32px;
    background-color: #fff;
    border: 1px solid #a5a5a5;
    line-height: 22px;
    cursor: pointer;
    font-size: 14px;
    outline: none;
    vertical-align: middle;
    padding: 5px 3px;
    display:flex;
	margin: 0;
    color: #222;
 }
 


.sel_Qt{
    width: 95px;   
    height: 32px;
    background-color: #fff;
    border: 1px solid #a5a5a5;
    line-height: 22px;
    cursor: pointer;
    font-size: 14px;
    outline: none;
    vertical-align: middle;
    padding: 5px 3px;
}
.add_follow {
    float: left;
         color:#212121;
    padding:0px 15px 0px 15px;
 display: inline-block;
}
  .opt_label {
      float:left;
    width:35px;
    font-size: 14px;
    color: #212121;
    margin-left: 12px;
    margin-right: 5px;
    padding-top:5px
  
}
 @media (max-width:800px) {
	 .pd_option{ display:block}
	 .p_specR{
		 word-break: break-all;
		 width:100%;
		 float:none;
         position: relative;}
     .sel_Qt   {width: auto}
 }

	
	
	
	/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

		buy btn
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/*----訂購產品按鈕----*/	
.bookinfoArea{
	float:left;
	width:100%;
	padding-bottom: 10px;
    margin-top:5px;
}
.bookinfoArea ul{
	padding:0;
	margin:0;
	margin-top:7px;
    list-style-type: none;
}

.bookinfoArea li{
	float:left;
    text-align: center;
    list-style: none;
	margin-right:10px}

@media screen and (max-width:800px) {
.bookinfoArea{
	padding-bottom: 0px;
    margin-top:15px;
}
}
	
  /* -----------------------------  


   購買按鈕 (每個版面都要換顏色)
   
   ----------------------------- */ 
  
 .book-info {
	 margin-bottom:15px;
  cursor: pointer;
  font-family:"微軟正黑體";
  font-size:15px;
  color: #fff;
  line-height: 1.3333333;
    background-color:#343a40;
	    border-radius: 4px;
  padding:10px 15px;
  border:none;
  text-decoration:none;
  display:block
}

 .book-info a{
  color: #fff; 
  border-radius: 4px;
   text-decoration:none
}
.book-notice{background:#a6a6a6; color:#fff}
.book-info:hover{
	opacity:0.8;
    color: #fff;
	text-decoration:none;
}
.book-addcart {
	margin-bottom:15px;
  cursor: pointer;
  font-family:"微軟正黑體";
  font-size:16px;
  color: #fff;
  line-height: 1.3333333;
  border-radius:4px;
  background:#ccc;
  padding:10px 16px;
  border:none
}	

/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

		產品內頁左側品牌介紹 
		 
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


.brand-info {
    position:relative;
  overflow: hidden;
  background: #FFFFFF;
  border:#ddd solid 1px;
  font-size: 0.9rem;
  line-height: 24px;
  word-break: break-all;
  font-size: 14px;
  line-height: 24px;
  margin:60px 0px  30px 0px;

}


 @media (max-width:800px) {
 .brand-info {  display: none;}
   }



.rightBox {
    float: right;
    padding: 20px 0;
}


/*產品介紹區*/
.productIntro{
	box-sizing: border-box;
	margin: 0;
padding: 0;
border: 0;}

.productIntro .albumBox{
	margin-right:12px;
	padding:0;
	max-width:45% !important;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 45%!important;
    -moz-box-flex: 0;
    -ms-flex: 0 0 45%!important;
    flex: 0 0 45%!important;}



@media (max-width: 768px){
.productIntro .albumBox{
	margin-right:10px;
	padding:0;
	max-width:100% !important;
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%!important;
    -moz-box-flex: 0;
    -ms-flex: 0 0 100%!important;
    flex: 0 0 100%!important;}

	}

.productIntro .albumBox .Img img{/*產品大圖*/
	width:100%;}

.productIntro .albumBox ul.side_album{
	margin:2px -1px 0 -1px;
	width:100%;}

.productIntro .albumBox ul.side_album li{
	float:left;
	width:16.6%;
	overflow:hidden;
	padding:1px;}

.productIntro .albumBox ul.side_album li a{
	display:block;}
	
.productIntro .albumBox ul.side_album li a img{
	display:block;
	width:100%;}
/*加購*/

input[type="checkbox"]{
    display:inline-block;
    width:15px;
    height:15px;
    background:none;
	margin:0;
	border: 1px solid #B5B3B3;
	vertical-align:text-bottom;
}
/* -----詳細介紹分頁------*/  

.Introtab{display:block;margin-top:60px; margin-bottom:60px;}
.Introtab a{display:block;float:left;padding:0 15px;font-size:15px;line-height:45px;border-left:none;color:#222; text-decoration:none;border-top:#ddd 1px solid;border-right:#ddd 1px solid }
.Introtab a:first-child{border-left:1px solid #ededed;border-right:#ddd 1px solid }

.Introtab a.current{color:#FFF;background:#a1abb6;}
.Introtab a:hover{background:#a1abb6; color:#FFF}

@media screen and (max-width:800px) {
	
.Introtab a{border:#DEDEDE  solid 1px; margin-bottom:20px; margin-right:10px} 

}
/* ---------------------
        詳細介紹內容
----------------------*/  

.IntroContainer {
    display: block;
    float: left;
    line-height: 1.8;
    padding: 30px 15px 20px 15px;
    border-top: #DEDEDE 1px solid;
    margin-top: 0px;
}

/* ---------------------
     本商品QRCODE
----------------------*/  


.brandQrcode_table {
    width:100%;
    font-family: "微軟正黑體";    
    border-collapse: collapse;
	border: 1px solid #e9ecef;
	
}
  
.brandQrcode_table td, .brandQrcode_table th {
    font-family: "微軟正黑體";  
    padding:10px 5px;
    text-align: center;

	font-size:16px;
	color:#212121
}
  .brandQrcode_table th a {  text-decoration: none;color:#333}

.brandQrcode_table tr { border:none}	

.brandQrcode_table thead {background:#ededed}
 
@media screen and (max-width:860px) {
.brandQrcode_table td, .brandQrcode_table th {font-size:14px;border:none}
}
@media screen and (max-width:768px) {
.brandQrcode_table td, .brandQrcode_table th {font-size:1em}

.brandQrcode_table td {display: block; text-align:center; padding:5px 3px; margin: 5px; }


}



/*---------------------
 productAdd
-----------------------*/
.addArea{
	padding:0;
	margin:0;
    max-width:99%;
    display: block;
    width:99%;}

.addcard {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
      word-wrap: break-word;
    background-color: #fff;
    background-clip: border-box;
    border: 1px solid rgba(0,0,0,.125);
    border-radius: .25rem;
    margin-bottom: 1.5rem!important;
    margin-top: 1.5rem!important;
   padding: 0;
    margin: auto;
    box-sizing: border-box;
	flex: 0 0 100%;
    max-width: 100%;
}

.addcard-header {
    border-radius:3px;
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}


.addcard h2 {
    letter-spacing: 0;
    font-weight: normal;
    position: relative;
    padding: 0 0 0;
    font-weight: normal;
    line-height: 120% !important;
    color: #6d6d6d;
    margin: 0;
    font-size: 16px;
    cursor: pointer;
}

    .addcard h2:before {
        color: #222;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        font: normal normal normal 14px/1 FontAwesome;
        font-size: inherit;
        text-rendering: auto;
        -webkit-font-smoothing: antialiased;
        content: "+";
        font-size: 17px;
        font-weight: bold;
        display: inline-block;
        padding-right: 5px;
        font-weight: bold;
        font-family: "微軟正黑體" ,sans-serif;
    }

.addcard-body {
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: 1.25rem;
}



.mediaBox {
    padding: 0;
    margin: 0 auto;
    position: relative;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.additemWrapper {
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 -1px 5px -1px;
}

.add-chkbox {
    display: inline-block;
    float: left;
    position: relative;
    padding: 0;
    height: 16px;
    width: 16px;
    margin: 10px 10px 0 0;
}

.addon {
    position: relative;
    z-index: 1;
    height: 100%;
    width: 100%;
}

.addImgBox {
    float: left;
    display: inline-block;
    margin-bottom: 0 5px 5px 0;
    position: relative;
    padding: 0;
    width: 70px;
    height: 70px;
    text-align: center;
    border: 1px solid #dee2e6!important;
    vertical-align: middle;
    padding: .25rem!important;
    box-sizing: border-box;
}



    .addImgBox img {
        width: 100%;
        height: 100%;
        cursor: pointer;
        display: block;
        text-align: center;
    }

.media-body {
    float: left;
    display: inline-block;
    -ms-flex: 1;
    flex: 1;
    overflow-wrap: break-word;
}

    .media-body p {
        word-break: break-all;
        line-height: 1.45rem;
        margin: 0px;
        padding: 5px;
        font-size:14px;
    }
	
	/*---用在login--*/
    .media-body span {
        word-break: break-all;
        line-height: 1.9rem;
        margin: 0px;
        padding: 5px;
        font-size:14px;
		
    }
	
	    .media-body span a{
        word-break: break-all;
        line-height: 1.9rem;
        margin: 0px;
        padding: 5px;
        font-size: 16px;
		display:inline-block;
		    color: #428bca;
    }
	
	
	.media-body span a:hover, .media-body span a:focus,.media-body span a:active, a.active {
    text-decoration: underline; color: #23527c; font-weight:bold
}
.add_select {
    vertical-align: middle;
    position: relative;
    display: flex;
    line-height: 1.75em;
    width: 100%;
    max-width: 100%;
}

.add_plus_select {
    width: 80% !important;
    margin: 10px auto 10px !important;
    height: 30px;
    background-color: #fff;
    line-height: 30px;
    cursor: pointer;
    font-size: 15px;
    border: 1px solid #ddd;
    vertical-align: middle;
    padding: 5px 3px;
    border-radius: 6px;
    display: inline-block;
}

.additemWrapper option {
    background-color: #FFF;
    border: 1px solid #a5a5a5;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    line-height: 30px;
}

.add_priceBox {
    position: relative;
    display: inline-block;
    font-size: 16px;
    text-align: center !important;
    vertical-align: middle;
    font-family: 'cwtexhei', 'Varela Round', '微軟正黑體', sans-serif;
    letter-spacing: .5pt;
    color: #3a3a3a;
    font-weight: normal;
    margin: auto;
    line-height: 1.45em;
    width: 100%;
    max-width: 100%;
}

.add_price {
    text-align: center;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-weight: 400;
    font-size: 14px;
     color: #ea6e6e;
    text-transform: uppercase;
}

.addcard hr {
    margin-top: 0.25rem;
    margin-bottom: 0.75rem;
    border: 0;
    border-top: 1px solid rgba(0,0,0,.1);
	clear:both
}




.product_quantity {
    cursor: pointer;
    padding: 0;
    min-width: 200px;
    flex: 1;
    position: relative;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    margin: 0 auto 8px auto;
}

.btn-group {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.countbtn {
    cursor: pointer;
    border-color: #E2E2E2;
    background-color: #ffffff;
    color: #424242;
    position: relative;
    display: inline-block;
    width: 30px;
    height: 30px;
    border: 1px solid #ddd;
}

    .countbtn:hover, .countbtn:focus, .countbtn.focus, .countbtn:active, .countbtn.active {
        color: #333;
        background-color: #e6e6e6;
        border-color: #adadad;
    }


.add-down, .add-up {
    position: relative;
    padding-left: 20px;
    padding-right: 20px;
    font-size: inherit;
    text-rendering: auto;
}

    .add-down:before {
        content: "";
        position: absolute;
        top: 13px;
        right: 11px;
        width: 19px;
        height: 1px;
        border-top: 1px solid #6d6d6d;
    }

    .add-up:before {
        content: "";
        position: absolute;
        top: 13px;
        right: 12px;
        width: 19px;
        height: 1px;
        border-top: 1px solid #6d6d6d;
    }

    .add-up:after {
        content: "";
        position: absolute;
        top: 5px;
        right: 20.5px;
        width: 1px;
        height: 19px;
        border-left: 1px solid #6d6d6d;
    }

.input-group-btn {
    margin: 0;
    display: inline-block;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    user-select: none;
    padding: 0.313rem 0.75rem;
    font-size: 1rem;
    line-height: 1.5;
    border-radius: 0.25rem;
    border: 1px solid #ddd;
}

.add-quantity {
    position: relative;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    user-select: none;
    font-size: 1rem;
    line-height: 1.5;
    border: 1px solid #ddd;
    float: left;
    width: auto;
    vertical-align: middle;
    display: inline-block;
    width: 80px;
}

@media (max-width:991px) {

    .mediaBox {
        padding: 0 15px;
    }

    .card-body {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 10px 5px;
    }
}


.owl-Box{
    clear: both;
    text-align: center;
    margin: 0 auto;
    max-width: 100%;
	
}
.owl-prev{
	display:inline-block;
	    position: absolute;
    color: #fff;
    margin-top:20%;
    padding: 0px;
    height:40px;
    width:40px;
    border-radius: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    line-height: 0;
    text-align: center;
    left:-15px;
	font-size:24px;
	z-index:2
	
}
.owl-prev:hover{ background:#a1abb6}
.owl-next{
	display:inline-block;
	    position: absolute;
    color: #fff;
    margin-top:20%;
    padding: 0px;
    height:40px;
    width:40px;
    border-radius: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    background: rgba(0, 0, 0, 0.2);
    -webkit-transition: .3s all ease-in-out;
    -o-transition: .3s all ease-in-out;
    transition: .3s all ease-in-out;
    line-height: 0;
    text-align: center;
    right:-15px;
	font-size:24px;
	z-index:2

}
.owl-next:hover{ background:#a1abb6}
.icon-keyboard_arrow_left{
    content: "<";
    position: absolute;
    line-height: 0;
	display:block;
	 position: absolute;
    top:35%;
    left:40%;
    border-right:2px solid #FFF;
    border-bottom:2px solid #FFF;
    width: 0.5em;
    height: 0.5em;
    transform: rotate(-225deg);
	 -webkit-transform:(-225deg);
	 cursor: pointer; 
}
.icon-keyboard_arrow_right { 
   position: absolute;
    line-height: 0;
    content: ">";
	display:block;
    top:35%;
    right:40%;
    border-right: 2px solid #FFF;
    border-bottom:2px solid #FFF;
    width: 0.5em;
    height: 0.5em;
    transform: rotate(-45deg);
	 -webkit-transform:(-45deg); 
	 cursor: pointer; }
@media (max-width: 991.88px){
.owl-Box {display:none}
}




.fastEvent {
    width: 195px;
    position: fixed;
    bottom:25vh;
    left: 35px;
    z-index: 11;
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
}



    .fastEvent.turn-on .eventag .on {
        display: none;
    }

    .fastEvent .eventag {
        text-align: center;
        line-height: 45px;
        transform-origin: bottom right;
        transform: rotate(-90deg);
        border-radius: 0px 0px 10px 10px;
        cursor: pointer;
        position: absolute;
        top: -40px;
        left: -120px;
        background: #ecf0f1;
        width: 120px;
        height: 40px;
        color: #777;
        font-family: 'Lato', 'Noto Sans TC', '微軟正黑體', sans-serif;
        font-size: 1em;
        font-weight: 400;
        letter-spacing: 5px;
    }


.fastEvent_arrow {
    overflow: visible;
    display: inline-block;
    font-size: inherit;
    height: 1em;
    width: 0.625em;
    overflow: visible;
    vertical-align: -.125em;
}

    .fastEvent_arrow:before {
        content: "";
        position: relative;
        line-height: 0;
        display: inline-block;
        top: -5px;
        border-right: 2px solid #777;
        border-bottom: 2px solid #777;
        height: 1em;
        width: 1em;
        transform: rotate(45deg);
        -webkit-transform: (45deg);
        cursor: pointer;
    }

@media (max-width:911px) {
    .header-info {
        display: none;
    }

    .proMenu {
        margin-top: 115px;
    }
}

@media only screen and (max-width:800px) {
    .pro-form {
        padding: 10px 30px 20px 30px;
        max-width: 82%;
        width: 82%;
        margin: auto;
    }
}

@media only screen and (max-width:767px) {
    .header-info .header-item {
        margin-bottom: 7px;
    }

    .header-info {
        display: none;
    }



        .fastEvent .eventag {
            opacity: 0.8;
        }
}